我想让文字在图片下边排,该怎么写这个css?
div class= "wrapperElement ">
<div class= "imageElement " onMouseover= "rattleimage(this) " onMouseout= "stoprattle(this) "> <img src= "img/harddisk.jpg "onClick= "secBoard( 'show your harddisk ', 'img/showharddisk.jpg ', 'your options text ') "/>
</div>
<div class= "scrollIconText "> 这里是文字 </div>
</div>
我想让文字在图片下边排,该怎么写这个css?
#icon-modules-div .wrapperElement {
DISPLAY: block; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; POSITION: absolute; HEIGHT: 100%; TEXT-ALIGN: center; BORDER-BOTTOM-STYLE: none
}
#icon-modules-div .imageElement {
LEFT: 15px; WIDTH: 50px; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; POSITION: absolute; HEIGHT: 35px; BORDER-BOTTOM-STYLE: none
}
其他两个写了, 差文字这个
是很多图片,每个图片下都有文字说明,
[解决办法]
试试 ul+li的
<style type= "text/css ">
#list{margin:0; padding:0}
#list li{float:left; margin-left:5px;}
.img{height:50px; width:75px}
.img img{height:50px; width:75px}
.txt{height:23px; width:75px; text-align:center}
</style>
<ul id= "list ">
<li>
<div class= "img "> <img src= "aaa.jpg " /> </div>
<div class= "txt "> 第一张图片 </div>
</li>
<li>
<div class= "img "> <img src= "aaa.jpg " /> </div>
<div class= "txt "> 第一张图片 </div>
</li>
</ul>
[解决办法]
<style type= "text/css ">
ul {margin:0; padding:0; float:left;}
ul li {margin-left:5px; text-align:center; float:left;}
ul li p {margin:5px 0;}
</style>
<ul>
<li> <img src= "aaa.jpg " /> <p> 说明 </p> </li>
<li> <img src= "aaa.jpg " /> <p> 说明 </p> </li>
</ul>