CSS 为父项 div 中的第二个嵌套 div 设置样式
CSS styling the 2nd nested div inside of a parent div
我有一些嵌套的 div 用作警告框。我想在父 div 上使用一个 class 来驱动其中 div 的样式。
<div class='aa-callout aa-prime'>
<div class='row p-1 h-100'>
<div class='col-1 d-flex align-items-center'>
<i class="fal fa-exclamation-circle fa-3x text-white mx-auto"></i>
</div>
<div class='col-11'>
<h4>Blue is for information</h4>
<p>Sed ut perspiciatis unde.</p>
</div>
</div>
</div>
我需要让包含
如果该结构是固定的(即非动态的),您可以使用此选择器:
.aa-prime > div:first-child > div:first-child { ...
(注意::nth-child(2)
不起作用,因为第二个 div
是第一个 div
的子代)
我有一些嵌套的 div 用作警告框。我想在父 div 上使用一个 class 来驱动其中 div 的样式。
<div class='aa-callout aa-prime'>
<div class='row p-1 h-100'>
<div class='col-1 d-flex align-items-center'>
<i class="fal fa-exclamation-circle fa-3x text-white mx-auto"></i>
</div>
<div class='col-11'>
<h4>Blue is for information</h4>
<p>Sed ut perspiciatis unde.</p>
</div>
</div>
</div>
我需要让包含
如果该结构是固定的(即非动态的),您可以使用此选择器:
.aa-prime > div:first-child > div:first-child { ...
(注意::nth-child(2)
不起作用,因为第二个 div
是第一个 div
的子代)