Heim > Web-Frontend > HTML-Tutorial > css控制图片只显示一部分_html/css_WEB-ITnose

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

WBOY
Freigeben: 2016-06-21 09:06:35
Original
1734 Leute haben es durchsucht


求助!!!

因为要通过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>
Nach dem Login kopieren

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

就可以实现效果了

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage