一尘不染

CSS选择另一个元素的多个子元素

css

是否可以在CSS中选择多个具有某个特定类,id等父的元素?例如:

table.exams caption, tbody, tfoot, thead, tr, th, td

如果不是,是否有办法选择该元素的所有子元素?


阅读 1079

收藏
2020-05-16

共1个答案

一尘不染

是否可以在CSS中选择多个具有某个特定类,id等父的元素?

当前,不幸的是,并非没有复制整个父选择器并指定所有后代,而是1:

table.exams caption, 
table.exams tbody, 
table.exams tfoot, 
table.exams thead, 
table.exams tr, 
table.exams th, 
table.exams td

直到选择器3最终确定后,他们才提出了伪类表示法来进行此操作,直到最近,基本实现才开始出现。

简而言之,现在已成为标准的伪类称为:matches()。在遥远的将来,一旦浏览器开始实施:matches(),您将可以执行以下操作:

table.exams :matches(caption, tbody, tfoot, thead, tr, th, td)

如果不是,是否有办法选择该类别的所有后代?

好吧,您可以简单地使用一个*代表任何元素的星号。鉴于您在选择器中有thtd,您可能意味着的所有后代而不是的所有子代table.exams,因此请不要使用>,而应使用空格:

table.exams *

但实际上,请 避免这样做 。如果可以,请尽最大努力指定您要选择的后代类型。


1 特别是对于表,您可以使用table.exams > :not(.colgroup), table.exams > * > tr>*,但是您可以看出它是难以置信的神秘(更不用说它假设您在此表中没有脚本支持元素或嵌套表),最好只列出所有您明确想要的后代。

2020-05-16