HTML列表不会中心

时间:2015-07-08 05:15:45

标签: html css

http://jsfiddle.net/pfW2v/39/

<ul style="text-align: center;list-style-type: none;margin: 1;padding: 0;display:inline-block;">
<li style="list-style-position:inside;font: 200 18px/1.5 Helvetica, Verdana, sans-serif;border-bottom: 6px solid #00ff09;width: 80px;">
    <a href="a">TopDave25</a> 1000</li>
<li style="font: 200 15px/1.5 Helvetica, Verdana, sans-serif;border-bottom: 6px solid #00a806;width: 80px;">
    <a href="b">Masterchief36</a> 400</li>
<li style="font: 200 10px/1.5 Helvetica, Verdana, sans-serif;border-bottom: 6px solid #0d6b1d;width: 120px;">
    <a href="#">Your Username!</a>
</li>

上面是显示我的列表的链接,我必须使用内联HTML(不能在HTML中使用CSS样式表或<style>,但使用text-align: center;什么都不做,我试过谷歌搜索它只是没有似乎想要居中

4 个答案:

答案 0 :(得分:4)

将它放在div中:

div
{
    width: 100vw;
    text-align: center;
}

答案 1 :(得分:0)

在HTML中:

#maindiv{
width:100%;
text-align:center;
}

在css中:

{{1}}

答案 2 :(得分:-1)

从li中删除单个宽度,并添加一个大约100px到ul的宽度..

它应该解决你的问题。

工作小提琴:jsfiddle.net/pfW2v/40 /

答案 3 :(得分:-1)

我已经修复了JSFiddle。

http://jsfiddle.net/Pankaj_Ladhar/pfW2v/44/

我为锚点添加了style="display:block",让它进入下一行。如果您不想删除此代码形式<a>代码。

我还将width:250px添加到<ul>,以使li看起来居中对齐。您可以像我们一样删除它。