问答详情
源自：15-2 水平居中设置-定宽块状元素

请问我是对块状元素的父元素设置了text-align:center，为何也可以实现块状元素的内容居中

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>定宽块状元素水平居中</title>
<style>
div{
    border:1px solid red;
}
.nav{
    text-align:center;
}
</style>
</head>
<body>
<div class="nav">
<p>我是定宽块状元素，我要水平居中显示。</p>
</div>
</body>
</html>


提问者：RadishWarrior 2016-05-11 11:13

个回答

  • 慕粉3917843
    2016-09-28 13:34:58

    text-align是让块状元素里的内容对齐的方式(这些内容一般为：内联元素、文本)。居中/左/右对齐。你设置DIV的text-align:center; 里面的内容自然对齐了。

    margin: 0 auto;  一般是用于块状元素自己本身相对于父元素居中。

    1
  • 青青草3342833
    2016-07-19 11:08:09

    你可以给div设置一个background-color看一下  这样就很明显了   只是文本居中 并不是div居中

    0
  • NewbieSXJ
    2016-06-01 13:18:59

    我觉得是你设置了对 div 这个标签元素居中，但 div 的宽度是和 父元素 body 100%等宽的，所有没能显示出来居中属性，而 p 标签继承了 居中 属性，所以 p 标签中的文字也 居中 显示了。

    要显示出 div 的居中属性，上一节课里说到可以设置 div 的宽度，从来显示出 div 的居中属性。

    0
  • 子卿君
    2016-05-11 11:32:27

    SS的某些样式是具有继承性的，那么什么是继承呢？继承是一种规则，它允许样式不仅应用于某个特定html标签元素，而且应用于其后代。比如下面代码：如某种颜色应用于p标签，这个颜色设置不仅应用p标签，还应用于p标签中的所有子元素文本，这里子元素为span标签。

    http://www.imooc.com/code/2038

    0