如何仅当段落直接跟随特定 H1 元素时才使用 CSS 设置段落样式？

了解 CSS 相邻同级选择器

设计 HTML 元素样式时，根据元素关系定位特定元素的能力至关重要。这就是 CSS 相邻兄弟选择器的用武之地。

问题陈述

考虑以下 HTML 和 CSS 代码：

<h1>

目标是为了确保每个

h1.hc-reform 元素后面的标签具有clear属性：both.

错误的尝试

所做的尝试：

h1.hc-reform > p {
  clear: both;
}

不起作用，因为 >选择器仅选择直接子元素。在这种情况下，

标签不是 h1.hc-reform 元素的直接子元素。

相邻同级选择器

要获得所需的结果，必须使用相邻同级选择器。它由加号 ( ) 表示。

h1.hc-reform + p {
  clear: both;
}

此选择器针对紧随指定元素之后的元素，在本例中为

。紧跟在 h1.hc-reform 元素之后的标记。

注意： Internet Explorer 6 及更早版本不支持相邻同级选择器。

以上是如何仅当段落直接跟随特定 H1 元素时才使用 CSS 设置段落样式？的详细内容。更多信息请关注PHP中文网其他相关文章！