Html 为什么使用子选择器时 table > tr > td 不起作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5568859/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why doesn't table > tr > td work when using the child selector?
提问by pimvdb
I can't really get why the following selector works as expected (i.e. get the td):
我真的不明白为什么以下选择器按预期工作（即获取td）：
table tr td
but this one doesn't:
但这个没有：
table > tr > td
The tdis a descendant of tr, which in turn is a descendant of table, but they are also children of each other. Therefore, I thought that the >selector would work too.
该td是的后代tr，这又是的后代table，但他们也彼此的孩子。因此，我认为>选择器也可以工作。
I made two fiddles:
我做了两个小提琴：
- Child: http://jsfiddle.net/brLee/
- Descendant: http://jsfiddle.net/brLee/1/
Why isn't the >selector working here?
为什么>选择器在这里不起作用？
回答by BoltClock
In HTML, browsers implicitly add a tbodyelement within which to contain the trelements1, so in reality, tris never a child of table.
在 HTML 中，浏览器隐式地添加了一个tbody元素，其中包含tr元素1，因此实际上，tr它永远不会是 的子元素table。
Consequently, you have to do this instead:
因此，您必须这样做：
table > tbody > tr > td
Of course, if you add a tbodyelement yourself, you use the same selector. The specexplains when a tbodyis added implicitly otherwise:
当然，如果您tbody自己添加元素，则使用相同的选择器。该规范时说明tbody添加隐含否则：
Tag omission
A
tbodyelement's start tag may be omitted if the first thing inside thetbodyelement is atrelement, and if the element is not immediately preceded by atbody thead, ortfootelement whose end tag has been omitted.
标签遗漏
如果
tbody元素中的第一个tbody元素是一个tr元素，并且该元素之前没有紧跟一个tbody thead，或者tfoot元素的结束标记已被省略，则可以省略该元素的开始标记。
1This is not the case for XHTML documents that are properly served as application/xhtml+xml, however, given its XML roots.
1然而，鉴于其 XML 根源，XHTML 文档的情况并非如此。application/xhtml+xml
回答by Sergiu
If you want to be more catholic than the pope :) here is what I did (because none of the above worked for me):
如果你想比教皇更天主教 :) 这就是我所做的（因为以上都不适合我）：
1) Create a css class, assign it to the property of the GridView (eg:
1）创建一个css类，将其分配给GridView的属性（例如：
<PagerStyle CssClass="pagerNoBorder" />
)
)
2) Define you css class just as the page numbers are rendered by your browser (inspect the element in the browser and look for all the child selectors!). In my case, this was the situation:
2) 在浏览器呈现页码时定义 css 类（检查浏览器中的元素并查找所有子选择器！）。就我而言，情况是这样的：
.pagerNoBorder > td > table > tbody > tr > td
{
border-width:0px !important;
border-style:none;
}
If you're going to say why border-width (+ !important) and border-style in the same time then read again the intro of my answer :) . Cheers and good day!
如果您要说为什么要同时使用 border-width (+ !important) 和 border-style，请再次阅读我的回答的介绍:)。干杯和美好的一天！
