我在HTML中有一堆DIV元素，其中幾個元素的class屬性設置爲「rowsLayout」。其中一些rowLayout DIV可以互相嵌套。我想定義一個CSS選擇器，它只針對這些嵌套中最深的DIV。也就是，我不要想要包含任何其他rowLayout DIVs的任何rowLayout DIVs。CSS選擇器在HTML樹中獲取特定類的最深元素
<div id="a" class="rowsLayout">
<div id="b" class="rowsLayout" />
<div id="c" class="rowsLayout">
<div id="d" class="rowsLayout" />
</div>
</div>
<div id="e" class="rowsLayout" />
利用這種結構，我想選擇器，將靶B，d，以及e。
可以這樣做嗎？
您能否考慮在父項目中添加諸如「父」之類的額外類的選項？它會更容易，並且是「標準」
P.S.我建議，但我真的不知道你是如何構建你的div，它是動態的嗎？ – jackJoe 2011-03-09 15:24:55
號
的選項有：按id選擇它們;爲這些樹葉添加第二個類，並按該類選擇;使用基於JavaScript的解決方案來設置適當的樣式（可能使用第二個類）。
取決於你有你既可以做類似的div數量：
div#b.rowsLayout,div#d.rowsLayout,div#e.rowsLayout {}
也許有更好的方法來解決你的問題，你有什麼適用於所有這些div？
您可以使用jQuery選擇器.rowsLayout:not(:has(.rowsLayout))。
但是，出於性能原因，this is not possible in CSS。
您的選擇取決於您定位的元素的兒童（或缺少）。
CSS的設計使元素的選擇器總是可以在元素的子元素存在之前解析出來;這允許CSS作爲文檔加載應用。
爲什麼不使用：空？
編輯：它也可以作爲一個CSS選擇器：
:empty { background-color: black; }
多個編輯：
:last-of-type差不多的作品，但它得到 'A' 出於某種原因。看我的小提琴。
通過ID
#b, #d, #e {
/* styles here */
}
選擇其中任何理由都順便說一句重複的類名？你可以在包裝或#layout東西，然後做的DIV整個事情...的
#layout div {
/* styles */
}
，而不是添加該類名字永遠股利。
看來，這是可能的，使用：dir或：lang屬性。
使用：lang在2015年是可取的，因爲它是由大多數瀏覽器支持。
實施例：
.container {
padding:20px;
}
:lang(ar) {
direction:rtl;
}
:lang(en) {
direction:ltr;
}
.container:lang(en) {
background-color:blue;
}
.container:lang(ar) {
background-color:red;
}
.container .a:lang(en) {
background-color:orange;
}
.container .a:lang(ar) {
background-color:yellow;
}<div id="searchHere">
<div lang=en>
<div class="container">
l t r
<div class=a>
a
</div>
</div>
<div lang=ar>
<div class="container">
r t l
<div class=a>
a
</div>
</div>
<div>
<div class="container">
r t l
<div class=a>
a
</div>
</div>
<div lang=ar>
<div class="container">
r t l
<div class=a>
a
</div>
</div>
</div>
<div lang=en>
<div class="container">
l t r
<div class=a>
a
</div>
<div lang=ar>
<div class="container">
r t l
<div class=a>
a
<div lang=en>
<div class="container">
l t r
<div class=a>
a
</div>
<div>
<div>
<div lang=en>
<div class="container">
l t r
<div class=a>
a
</div>
</div>
</div>
<div lang=ar>
<div class="container">
r t l
<div class=a>
a
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>雖然示例演示了這種與LTR和RTL中，：朗在理論上可以被製成表現爲最深匹配，使用例如：朗（最深的覆蓋 - 全部），儘管這可能不是lang =最深的地方 - 覆蓋 - 所有都應該在元素上定義。
看看這個：
div#b:first-of-type {
style here
}
我不認爲有一個CSS選擇器，可以做到這一點。 – thirtydot 2011-03-09 15:23:23