Ned*_*ius 5 html css text-align
我试过寻找答案但没有任何效果.我试图对齐一个段落.我很确定没有什么能覆盖CSS中的代码.这是HTML和CSS:
body {
background-image: url("../../images/pic01.jpg");
background-repeat;
}
#main {
background-color: rgb(255, 84, 0);
width: 75%;
margin-left: auto;
margin-right: auto;
margin-bottom: auto;
margin-top: auto;
overflow: auto;
height: 100%;
color: rgb(255, 255, 255);
}
#center {
text-align: center;
}<body id="top">
<div id="main">
<p id="center">
<h1> TEST </h1>
</p>
</div>
</body>这里有什么错误？
con*_*exo 10
text-align: center影响纯文本节点以及具有display: inline;或的子元素display: inline-block;.您假定的子元素h1默认具有display: block;.因此,即使它被允许有一个h1内部a p,这仍然不起作用(例如,如果你替换<p id="center">了<div id="center">你仍然遇到"非工作"居中).
p只能使用所谓的短语内容,也就是说,只允许某些元素作为段落中的子元素.
使用任何流内容元素(例如h1)导致"周围" 标签的自动关闭p.这就是您的浏览器真正呈现的内容:
<div id="main">
<p id="center"> </p>
<h1> TEST </h1>
</div>
最后一件事,因为你说你是前端问题的初学者:
不要#id在CSS中使用选择器.总是使用CSS .classes.当你进一步发展时,请阅读这里的原因:http://oli.jp/2011/ids/