html - 将样式添加到具有已知类的 div 的第二个孩子

Question

<a href="" class="header-logolink">

    <div>
        <img class="header-logoimage" src="~/images/SummerFling-logo.jpeg" alt="Summer Fling"/>
    </div>
    <div>
        <h1 class="header-logotext">Summer Fling</h1>
    </div>

</a>

如何<div>在不向 2 添加类的情况下向2 添加单独的样式<div>？

我试过使用：

.header-logolink:nth-child(1) {

}

但这会影响样式而不是这里看到<a>的第一个样式。<div>

标签： htmlcsscss-selectorsattributesstyling

Answer 1

您正在选择带有第 n 个元素的锚标记，您必须选择 div 然后指定第 n 个元素，如下所示

.header-logolink div:nth-child(1) {
  background-color:red;
}

.header-logolink div:nth-child(2) {
  background-color:green;
}