首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >HTML列表不会居中

HTML列表不会居中
EN

Stack Overflow用户
提问于 2015-07-08 13:15:45
回答 4查看 136关注 0票数 1

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

代码语言:javascript
运行
复制
<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>

上面的链接显示了我的列表,我必须使用内联超文本标记语言(不能在超文本标记语言中使用CSS样式表或<style>,但使用text-align: center;没有任何作用,我尝试过谷歌搜索,但它似乎不想居中

EN

回答 4

Stack Overflow用户

发布于 2015-07-08 13:18:28

将其放在div中:

代码语言:javascript
运行
复制
div
{
    width: 100vw;
    text-align: center;
}
票数 5
EN

Stack Overflow用户

发布于 2015-07-08 13:22:58

从li中删除单个宽度,并向ul添加一个宽度,例如大约100px。

它应该能解决你的问题。

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

票数 0
EN

Stack Overflow用户

发布于 2015-07-08 16:47:45

在HTML中:

代码语言:javascript
运行
复制
<div id="maindiv">
<ul style="text-align: center;list-style-type: none;margin: 1;padding: 0;display:inline-block;">

<!-- ALL CODE INSIDE DIV -->

</ul>
</div>

在css中:

代码语言:javascript
运行
复制
#maindiv{
width:100%;
text-align:center;
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/31284002

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档