将样式添加到已知 class 的 div 的第二个 child

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 <div> 添加单独的样式？

我试过使用：

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

}

但这会影响 <a> 的样式，而不是此处显示的第一个 <div>。

Answer 1

您正在 select 使用第 n 个元素设置锚标记，您必须 select div 然后指定第 n 个元素，如下所示

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

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

Answer 2

试试这个来设计第一个 div child

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

将样式添加到已知 class 的 div 的第二个 child

Add styling to 2nd child of div with known class

html

css

attributes

styling

css-selectors