请看看http://www.animefushigi.com/的页脚,我试图让联盟列表2列,因为1太长。使列表2列
的代码如下
<ul class="none"><li><span>Affiliates<em> </em></span></li>
<li>link 1</li>
<li>link 2</li>
etc etc
请看看http://www.animefushigi.com/的页脚,我试图让联盟列表2列,因为1太长。使列表2列
的代码如下
<ul class="none"><li><span>Affiliates<em> </em></span></li>
<li>link 1</li>
<li>link 2</li>
etc etc
也许你可以嵌套UL这样的:http://jsfiddle.net/seler/ThvUJ/(以即LTE 8不会工作:
<ul class="none">
<li><span>Affiliates<em> </em></span></li>
<ul>
<li>link 1</li>
<li>link 2</li>
</ul>
<ul>
<li>link 3</li>
<li>link 4</li>
</ul>
</ul>
你可以只使用CSS尝试这样的事情)
但我认为这样做的最好方法是制作js脚本,它将计算li元素并在必要时添加</ul><ul>
。 (例如:http://jsfiddle.net/seler/ThvUJ/3/)
如果你希望你的页脚是一个特定的高度,你可以这样做:http://jsfiddle.net/NfMPX/
基本上,设置ul
的高度和浮动,并设置一个宽度为li
S和他们会自动换行。
如果顺序无关紧要(我假设它并不是因为您使用的是无序列表),您可以使用当前HTML实现此效果。只需浮动您的列表元素,使其中只有两个可以适合每行。下面是我的意思一个简单的例子:
ul {
width: 200px;
list-style: none;
}
li {
float: left;
width: 90px; /* 100 - 5 - 5 */
margin: 3px 0;
padding: 0 5px;
}
li a {
width: 90px;
display: block;
}
谢谢,我这样的clutz><我在45%的宽度由李嵌套UL,他们让自己变成列。 – GreatestSwordsman 2011-05-11 02:36:02