并排使用CSS的图像项目

Question

我试图使用css并排显示图像.问题是图像不是内联显示而是作为列表显示(我使用标签来完成此操作).也许我使用了错误的标签类型或者我的css是错误的(见下文):

ul {float:left; 宽度:15em;/*宽度改变*/margin:0; 填充:0; list-style-type:none; list-style-position:outside; } li {float:left; 宽度:100%; 保证金:20%; }

我可以用一些帮助=)

Answer 1

试试这个:

ul.gallery {
   height:425px;
   width:200px;
   list-style-type: none;
}
ul.gallery li {
   border:1px solid #BBBBBB;
   float:right;
   height:50px;
   margin-right:7px;
   margin-top:7px;
   width:50px;
}

和(x)html

<ul class="gallery">
    <li><img src="images/0001.jpg" /></li> 
    <li><img src="images/0001.jpg" /></li> 
    <li><img src="images/0001.jpg" /></li> 
    <li><img src="images/0001.jpg" /></li> 
    <li><img src="images/0001.jpg" /></li> 
    <li><img src="images/0001.jpg" /></li> 
    <li><img src="images/0001.jpg" /></li> 
    <li><img src="images/0001.jpg" /></li> 
    <li><img src="images/0001.jpg" /></li>
</ul>