我如何选择所有tr元素除了第一个tr在一个表与CSS?
我试过用这种方法,但发现行不通。
我如何选择所有tr元素除了第一个tr在一个表与CSS?
我试过用这种方法,但发现行不通。
当前回答
听起来你所说的“第一行”是你的表标题-所以你真的应该考虑在你的标记中使用thead和tbody(点击这里),这将导致“更好的”标记(语义正确,对屏幕阅读器有用)和更简单,跨浏览器友好的css选择的可能性(表标题…{…})
其他回答
我很惊讶居然没有人提到兄弟组合子的使用,IE7及后续版本都支持兄弟组合子:
tr + tr /* CSS2, adjacent sibling */
tr ~ tr /* CSS3, general sibling */
它们的功能完全相同(在HTML表的上下文中):
tr:not(:first-child)
听起来你所说的“第一行”是你的表标题-所以你真的应该考虑在你的标记中使用thead和tbody(点击这里),这将导致“更好的”标记(语义正确,对屏幕阅读器有用)和更简单,跨浏览器友好的css选择的可能性(表标题…{…})
你也可以像这样在CSS中使用伪类选择器:
.desc:not(:first-child) {
display: none;
}
这将不会将类应用到带有.desc类的第一个元素。
下面是一个带有示例的JSFiddle: http://jsfiddle.net/YYTFT/,这是一个很好的解释伪类选择器的源代码:http://css-tricks.com/pseudo-class-selectors/
您可以创建一个类,并在定义所有希望(或不希望)被CSS选择的future时使用该类。
这可以通过书写来完成
<tr class="unselected">
然后在你的CSS中有这些行(并使用text-align命令作为例子):
unselected {
text-align:center;
}
selected {
text-align:right;
}
另一个选择:
tr:nth-child(n + 2) {
/* properties */
}