Css选择“标题”后的第一个元素

Question

我想在header元素之后选择第一个给定元素，我该如何使用CSS？

<header>
...
</header>

<div>Content</div>

标题之后的div也可以是img或类似的东西..

Answer 1

要选择任何元素，请紧跟header作为兄弟姐妹，您可以使用

header + * {
  margin-left: 10px;
}

Answer 2

如果您的第一个元素始终为<div>，则可以使用Id或Class选择器。

</header>
<div id="first">...</div>

的CSS：

#first {
    /* formatting */
}

更多关于id and class

如果下一个元素不总是<div>，您可以使用相邻的选择器。相邻选择器是基于给定顺序中出现的两个标签匹配的选择器。您的第一个标记始终为<header>，第二个标记未知。

header + * {
    /* formatting */
}

这是一个总结CSS selectors的优秀表格。

Answer 3

只需使用类似的东西

header + div{

}

header + img{

}

header + section{

}

或

header + div,header + section,header + img{

    }