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

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

WBOY
Release: 2016-06-21 09:06:35
Original
1734 people have browsed it


求助!!!

因为要通过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>
Copy after login

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

就可以实现效果了

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template