试图为此找到 CSS
选择器,但未能成功。
我需要具有类 rtIn
的 Span,其中其父级 UL
必须是 li
的子级
我试过了,但它适用于每个节点
.rtLI > ul > li > div > Span.rtIn {
font-size: 10px;
}
<ul class="rtUL">
<li class="rtLI">
<div class="rtTop">
<span class="rtSp">Parent</span>
<span class="rtMinus"></span>
<span class="rtIn"></span>
</div>
<ul class="rtUL">
<li class="rtLI rtLast">
<div class="rtBot">
<span class="rtSp"></span>
<span class="rtIn">Child</span>// i required this Span
</div>
</li>
</ul>
</li>
<li class="rtLI">
<div class="rtMid">
<span class="rtSp"></span>
<span class="rtIn">Child</span>
</div>
</li>
<li class="rtLI rtLast">
<div class="rtBot">
<span class="rtSp"></span>
<span class="rtIn">Child</span>
</div>
</li>
</ul>
有什么更正吗?
这是在 FireFox 和 Chrome 中的输出
最佳答案
.rtLI > ul > li > div > Span.rtIn {
font-size: 10px;
}
<ul class="rtUL">
<li class="rtLI">
<div class="rtTop">
<span class="rtSp"></span>
<span class="rtMinus"></span>
<span class="rtIn"></span>
</div>
<ul class="rtUL">
<li class="rtLI rtLast">
<div class="rtBot">
<span class="rtSp"></span>
<span class="rtIn"></span>// i required this Span
</div>
</li>
</ul>
</li>
<li class="rtLI">
<div class="rtMid">
<span class="rtSp"></span>
<span class="rtIn"></span>
</div>
</li>
<li class="rtLI rtLast">
<div class="rtBot">
<span class="rtSp"></span>
<span class="rtIn"></span>
</div>
</li>
</ul>
选择器起作用了!
您的 HTML
代码有一个HTML 语法错误:
你有:
span class="rtIn"></span>
应该是:
<span class="rtIn"></span>
Google Chrome 正在获取 CSS 样式:
关于子元素的 CSS 选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26357892/