为了账号安全,请及时绑定邮箱和手机立即绑定

我把text-align分别用了2次在.container ul和.container li中,不使用container的css,为什么无法居中

不是只要转化为行内元素 就可以使用text-align居中吗


<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>不定宽块状元素水平居中</title>
<style>
/*.container{text-align:center;}*/
.container ul{list-style:none;margin:0;padding:0;display:inline;text-align:center;}
.container li{margin-right:8px;display:inline;text-align:center;}
</style>
</head>
<body>
<div class="container">
    <ul>
    <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
    </ul>
</div>
</body>
</html>


正在回答

3 回答

因为text-align是用来设置你需要居中元素的"父元素"。比如要设置转为行内元素(inline)的ul标签,找到它的父元素div,设置类containr为:text-align:center.你可以再回过头来看下15-1,是行内元素的父元素设置居中。

0 回复 有任何疑惑可以回复我~
#1

Otone 提问者

"如果被设置元素为文本、图片等行内元素时,水平居中是通过给父元素设置 text-align:center 来实现的。" 可是为什么15-1的代码是这样设置,不是应该设置在div里吗 <style> .txtCenter{ text-align:center; } </style>
2018-07-08 回复 有任何疑惑可以回复我~
#2

Gaberial 回复 Otone 提问者

你这个.txtCenter就是指的div,它是div的一个类名
2018-07-29 回复 有任何疑惑可以回复我~

再看一遍15-1你就明白了 text-align:center就是设置给父元素的

0 回复 有任何疑惑可以回复我~

这个.txtcenter是设置在div里面啊(<div class="texCenter">),不过是用了类选择器的方法啊。除了类,还有ID选择器,可能你有点忘记前面学习的了。

0 回复 有任何疑惑可以回复我~
#1

Otone 提问者

还是不是很懂,不过大概有个方向了,我去复习前面吧,感谢
2018-07-08 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

我把text-align分别用了2次在.container ul和.container li中,不使用container的css,为什么无法居中

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信