html - 何时使用 CSS + 符号

Question

<分区>

Answer 1

我发现当您想对一系列元素的第一个元素应用特殊样式时，相邻兄弟选择器 很有用。例如，如果您想要将文章的第一段设置为不同于其他段落的样式，您可以使用:

p {
    /* styles for the first paragraph  */
}

p + p {
    /* styles for all other paragraphs */
}

在许多情况下，这可以代替使用 class="first"。

编辑:使用first-child 伪类对于这种特定情况会更好，因为它得到更广泛浏览器的支持。 (感谢亚历克斯)

您可能还想调整某些元素在彼此相邻时的定位方式。如果您有一个无序列表，它本身看起来不错，但在段落旁边需要较少的顶部填充，您可以使用:

ul {
    padding-top: 1em;
    /* Default ul styling */
}

p + ul {
    padding-top: 0;
    /* special styling for lists that come after paragraphs */
}