我的标题和文档的另一部分中有一个h1.我被告知这个影响搜索引擎优化,但我离题,我只是通过复制其他人的页面并尝试设置他们的样式,而不是看他们的代码.
所以我的h1样式很好但是当我在一个section类中定位h1时,样式不适用.
h1 {
text-align: center;
font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
font-size: 1.7em;
font-weight: 400px;
margin: 1px auto 13px;
}
.header h1 {
border-top: 3px double #232323;
padding-top: 10px;
font-family: inherit;
}Run Code Online (Sandbox Code Playgroud)
<body>
<h1>This is a header</h1>
<section class="header">
<h1>This is a header</h1>
</section>
</body>Run Code Online (Sandbox Code Playgroud)
我的猜测是class.h1规则覆盖了h1规则.如果是这种情况,我如何将我的顶部边框应用于我的h1,同时仍然继承h1属性.
如果我谋杀任何CSS术语,请道歉.
inherit关键字指定属性应从其父元素继承其值.所以父节是节,并且节上没有字体规则.删除继承.
h1 {
text-align: center;
font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
font-size: 1.7em;
font-weight: 400;
margin: 1px auto 13px;
}
.header h1 {
border-top: 3px double #232323;
padding-top: 10px;
}Run Code Online (Sandbox Code Playgroud)
<body>
<h1>This is a header</h1>
<section class="header">
<h1>This is a header</h1>
</section>
</body>Run Code Online (Sandbox Code Playgroud)