在section中的h1与h2的默认大小是一样的,具体原因是浏览器默认样式里面,对h1不同层级设置了特殊的样式。
转载于:
HTML5 h1多层次样式问题_weixin_34161083的HTML5 h1多层次样式问题_weixin_34161083的博客-CSDN博客HTML5 h1多层次样式问题_weixin_34161083的
下面的代码如果不在section中,默认是h1>h2,但在section却不是这样
<section>
<h1>我是在section中的h1</h1>
<h2>我是在section中的h2</h2>
</section>
如果是放在多层section中,h1的页面展示会更小
<section>
<section>
<section>
<h1>我是在section中的h1</h1>
<h2>我是在section中的h2</h2>
</section>
</section>
</section>
可以通过:-webkit-any(article,aside,nav,section) h1 属性进行更改,直接复制h1的样式放里面去
:-webkit-any(article,aside,nav,section) h1 {
display: block;
font-size: 2em;
margin-block-start: 0.67em;
margin-block-end: 0.67em;
margin-inline-start: 0px;
margin-inline-end: 0px;
font-weight: bold;
}