使用CSS如何仅更改表的第2列

Question

仅使用css,如何仅覆盖表的第2列的css.

我可以使用以下方法访问所有列:

.countTable table table td

我无法访问此页面上的html来修改它,因为它不是我的网站.

谢谢.

Answer 1

您可以:nth-child像这样使用伪类:

.countTable table table td:nth-child(2)

请注意,这在旧版浏览器(或IE)中不起作用,在这种情况下,您需要为单元格提供类或使用javascript.

Answer 2

试试这个:

.countTable table tr td:first-child + td

您还可以重申以设置其他列的样式:

.countTable table tr td:first-child + td + td {...} /* third column */
.countTable table tr td:first-child + td + td + td {...} /* fourth column */
.countTable table tr td:first-child + td + td + td +td {...} /* fifth column */

Answer 3

要仅更改表的第二列,请使用以下内容:

一般案例:

table td + td{  /* this will go to the 2nd column of a table directly */

background:red

}

你的情况:

.countTable table table td + td{ 

background: red

}

注意:这适用于所有浏览器(现代和旧版),这就是为什么我在旧问题中添加了答案