0

我需要 9 张图像水平显示在 WordPress 页脚中。我输入了以下 HTML：

<div id="sponsers">
<ul>
<li><img src="http://mysite.com/image1.png" width=257 height=67></li>
<li><img src="http://mysite.com/image1.png" width=217 height=29></li>
<li><img src="http://mysite.com/image1.png" width=178 height=49></li>
<li><img src="http://mysite.com/image1.png" width=64 height=68></li>
<li><img src="http://mysite.com/image1.png" width=103 height=162></li>
<li><img src="http://mysite.com/image1.png" width=66 height=56></li>
<li><img src="http://mysite.com/image1.png" width=121 height=85></li>
<li><img src="http://mysite.com/image1.png" width=134 height=36></li>
<li><img src="http://mysite.com/image1.png" width=162 height=61></li>
</ul>
</div>

CSS：

.sponsers ul {
    margin: 0; padding: 0; 
    display: inline;
    list-style-type: none; list-style-image: none;
}
.sponsers li {
    isplay: inline;
    padding-right: 0px;
    width: 900px;
    list-style-type: none; list-style-image: none;
}

图像仍以垂直线显示，带有三个小列表点。它似乎忽略了CSS。我可能遗漏了一些明显的东西，或者没有正确设置它。有什么绝妙的主意吗？

4

3 回答 3

1

CSS 中的A.是一个类，但你<div>有一个 ID，而不是一个类。将您的 CSS 切换到#sponsersetc.，它将起作用。

（顺便说一句，您不需要显示<ul>内联 - 只需显示<li>s。）

于 2013-05-26T03:28:53.417 回答
0

几乎没有什么需要修复的。
在你的 CSS 中，你可以在你的标记.sponsers中给出。id这就是为什么任何样式都不会生效的原因。
其次，要<li>内联你必须添加display:inline，现在写有一个错字，你错过D了DISPLAY！

所以完整的代码应该是

.sponsers ul {
margin: 0; padding: 0; 
display: inline;//you can remove this
list-style-type: none; list-style-image: none;
}

.sponsers li {
display: inline;
padding-right: 0px;
width: 900px;
list-style-type: none; list-style-image: none;
}

并在标记中

<div class="sponsers"> <!--You have ID here-->
于 2013-05-26T05:20:02.580 回答
0

ul从和中删除内联li。float: left上使用li。将溢出隐藏到sponsersdiv。最大的错误是将 a.用于 a id。使用#sponsers.

这是一个工作示例：http: //jsfiddle.net/rutwick/NG2nF/

我使用的 CSS：

#sponsers{
    overflow: hidden;
}

#sponsers ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

#sponsers ul li{
    float: left;
    padding: 0 5px;
}

#sponsers ul li img{
    height: 50px;
    width: 50px;   
}
于 2013-05-26T03:28:36.030 回答