為什么圖片沒有隱藏起來,下附代碼。求解答.
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<style type="text/css">
*{padding: 0;margin: 0}
body{
? ? background-color:#fff;
? ? color:#555;
? ? font-family:'Avenir Next','Lantinghei SC';
? ? font-size: 14px;
? ? -webkit-font-smoothing:antialiased;
}
.wrap{
? ? ? ? ? width:100%;
? ? ? ? ? height:600px;
? ? ? ? ? position:absolute;
? ? ? ? ? top:50%;
? ? ? ? ? margin-top:-300px;
? ? ? ? ? background-color:#333;
? ? ? ? ? overflow:hidden;
? ? ? }
.photo{
? ? width: 260px;
? ? height: 320px;
? ? position: absolute;
? ? z-index: 1;
? ? box-shadow: 0 0 1px rgba(0,0,0,.01);
}
.photo .side{
? ? width: 100%;
? ? height:100%;
? ? background-color: #eee;
? ? position: absolute;
? ? top:0;
? ? right: 0;
? ? padding: 20px;
}
.photo .side-front{}
.photo .side-front .image{
? ? ?width: 100%;
? ? ?height: 250px;
? ? ?line-height: 250px;
? ? ?overflow: hidden;
}
.photo .side-front .image img{
? ? ?width: 100%;
}
.photo .side-front .caption{
? ? text-align: center;
? ? font-size: 16px;
? ? line-height: 50px;
}
.photo .side-back{display: none;}
</style> ? ??
<body>
<div class="wrap">
? ?<div class="photo">
? ? ?<div class="side sdie-front">
? ? ? ? ?<p class="image"><img src="015.jpg"/></p>
? ? ? ? ?<p class="caption">騎行</p>
? ? ?</div>
? ? ?<div class="side side-back">
? ? ? ? ?<p class="desc">描述信息</p>
? ? ?</div>
? ? </div>?
? </div> ?
</body>
</html>
2015-12-23
.photo .side-back{display: none;}這么寫是不對(duì)的? 改成.photo, .side-back{display: none;}
2015-12-23
沒看到你哪里有代碼要把圖片隱藏起來呀,只有把描述信息給隱藏起來的代碼。