masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > html tutorial > teks badan

css控制图片只显示一部分_html/css_WEB-ITnose

WBOY
Lepaskan： 2016-06-21 09:06:35
asal
1726 orang telah melayarinya


求助！！！

因为要通过js控制满足某条件的时候，显示图片上面那个部分，然后另一个条件下显示下面那个部分


回复讨论(解决方案)

<!doctype html><html lang="en"><head>	<meta charset="UTF-8" />	<title> 页面名称 </title><style type="text/css">#test1 {	width: 16px;	height: 17px;	background: #999 url("http://img.bbs.csdn.net/upload/201509/17/1442477922_879930.png") no-repeat left bottom;}#test2 {	width: 16px;	height: 17px;	background: #999 url("http://img.bbs.csdn.net/upload/201509/17/1442477922_879930.png") no-repeat left top;}</style></head><body><div id="test1"></div>-----------------------------<div id="test2"></div></body></html>
Salin selepas log masuk

啊啊 会了  就是用个容器把图片包住，容器设置高度
然后css设置图片的position属性为relative，还有top为XXpx

就可以实现效果了

Label berkaitan：
css控制图片只显示一部分
sumber：php.cn
Artikel sebelumnya：用HTML和CSS实现WWDC 2015上的动画效果_html/css_WEB-ITnose Artikel seterusnya：[iOS Animation]-CALayer 图像IO三_html/css_WEB-ITnose
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Saya menghadapi masalah dengan grid CSS yang ketinggiannya tidak seperti yang saya jangkakan, apakah kesilapan yang mungkin saya lakukan? Saya sedang belajar grid CSS dan diminta untuk membuat kad ini dengan memecahkannya kepada...
daripada 2024-04-06 12:52:14
0
1
339
Buat susun atur kad yang pelbagai menggunakan grid tunggal atau Flex: panduan praktikal Saya cuba membuat susun atur kad responsif seperti dalam gambar. Apa yang saya lakukan pad...
daripada 2024-04-02 21:07:36
0
2
377
Ikon SVG Reactjs adalah saiz yang berbeza walaupun css yang sama Ini adalah kali pertama saya membina laman web menggunakan reactjs. Saya telah menggunakan...
daripada 2024-04-01 13:18:38
0
1
355
Bagaimana untuk membetulkan ralat ini tentang keadaan dalam tindak balas? Saya ingin membuat aplikasi reaksi mudah di mana apabila saya menekan enter pada blok, blo...
daripada 2024-04-01 09:32:43
0
1
329
52 imej dalam Array JS Saya sedang belajar Pembantu IT 1 tahun dan pada masa ini kami perlu menulis permainan kad...
daripada 2024-03-30 21:14:49
0
1
272
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan