在CSS中选择多个子级 [英] select multiple child in css
问题描述
我正在尝试在CSS中为表应用省略号类. 因此,有一些列需要具有此省略号类.我在一个表中有多个列.
I am trying to apply ellipsis class in css for a table. So there are some columns need to have this ellipsis class. I have multiple columns in a table.
我正在通过CSS中的nth-child
属性执行此操作,是否还有其他方法可以选择随机多个子级?
I am doing this by nth-child
property in css, Is there any some another way to select random multiple child?
我尝试过-
.ListTaskTime tbody tr >td:nth-child(3) a
{
text-overflow: ellipsis;
width:150px;
display: block;
overflow: hidden;
word-break:keep-all;
zoom:normal;
line-break:normal;
white-space:pre;
}
尽管同一张表中还有一列5th-child
,但是现在我需要为这个孩子创建一个单独的类,因此需要创建其他列.
Though same table has one more column 5th-child
, now for this child i need to make a separate class, hence for other columns.
我不想扩展CSS代码. 还有其他解决方案吗?
I don't want to expand my css code. Is there any other solution?
推荐答案
您可以使用逗号,
.ListTaskTime tbody tr >td:nth-child(3),
.ListTaskTime tbody tr >td:nth-child(6),
.ListTaskTime tbody tr >td:nth-child(9) {
/* Common Styles Goes Here, Styles will apply to child 3,6 and 9 */
}
注意:您需要检查nth-child
并在样式表中手动定义它,因为如果列增加,CSS则无法为您决定.
Note: You need to check the nth-child
and define it manually in your stylesheet, as CSS cannot decide it for you if columns increase.
如果使用服务器端语言生成动态表,则可以使用substr()
之类的功能来减少字母.
If you are using a server side language for generating a dynamic table, you can use functions like substr()
to cut down the letters.
侧面说明:除非并且直到没有任何子表,否则不必使用>
..tbody tr td:nth-child(3)
Side note : You don't have to use >
unless and until you don't have any child table, this is sufficient.. tbody tr td:nth-child(3)
这篇关于在CSS中选择多个子级的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!