Question

两句css给同一个表格的td标签设置背景色谁会起作用?为什么?

.doc_function_block td.term { background:#ff0; }
#doc_center_content table td { background:#fff; }
该td 标签的class=term
这与doc_function_block和doc_center_content在html里出现的次序有关么?
这与doc_function_block和doc_center_content在css里出现的次序有关么?

如果我在加一句对td所在表格的属性
.collapse .ref_cluster table { background:#0ff !important; }
会对td的背景色产生影响么

Answer 1

css样式优先级和css先后顺序有关，那是指优先级一样的情况下，后面写的会覆盖前面的

你的这个例子很明显优先级是不一样的，id选择器优先级比类选择器大，所以你那两句代码怎么颠来倒去也是执行id选择器那个的

!important
优先级其实是高于其他的，但是你.collapse .ref_cluster table { background:#0ff !important; }
这句是写的table的背景颜色，和td没有关系，也没有优先级的考虑，只是table和td都设置背景颜色后，td背景颜色是盖在table背景颜色上的，就像一张桌子上铺了一张纸，那总是看见纸的颜色的

Answer 2

这里就涉及到css样式的优先级了。
从大的方面将，html文档中样式有三种定义方式。
1、外部样式，通过link引用外部样式文件，如<link rel="stylesheet" type="text/css" href="style.css"/>
2、内部样式，在html文档中定义样式，如h3{color:green;}
3、内嵌样式，在某个dom元素上定义style。
这三种方式的优先级从1-3逐渐增强。
如果同时定义了好几个样式作用于一个元素上，则最终起作用的按照以下优先级。
1. 内联样式表的权值最高 1000；
2. ID 选择器的权值为 100
3. Class 类选择器的权值为 10
4. HTML 标签选择器的权值为 1
权值越高的就优先起作用。

Answer 3

后面写的会覆盖前面写的