gpt4 book ai didi

html - 样式未应用于 CSS 中的 H1 元素

转载 作者:太空狗 更新时间:2023-10-29 15:29:43 26 4
gpt4 key购买 nike

我遇到了一个奇怪的问题,样式没有应用到 H1 元素。

代码:

p h1 {
color: red;
}
<p>
<h1>This is a header</h1>
</p>

最佳答案

不能将标题(H1H6)作为p 的子级, 那是无效的 HTML。

它不起作用,因为您的浏览器会在 h1 元素开始之前自动关闭 p 元素,留下下面生成的 DOM(代码):

<p> </p>
<h1>This is a header</h1>
<p> </p>

使用 F12 访问浏览器的开发者工具或使用 CTRL + U 查看源代码,您可以看到生成的上面的 DOM。


相反,您可以在 p 或标题(H1H6)中使用 span

h1 {
color: red;
}
h2 span {
color: green
}
p span {
color: blue
}
<h1>This is a header</h1>
<h2><span>This</span> is a second header</h2>
<p><span>This</span> is a paragragh</p>

查看更多关于 headings contents 的信息和 phrasing elements在 W3C 规范中

关于html - 样式未应用于 CSS 中的 H1 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37838366/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com