这是来自
here问的另一个问题,但我认为这可能是一种“最佳实践”方法.
在设计网站时,设计师很可能会为网站中的所有元素组合一组通用样式. (Div / Spans / H1 / H2s中文本的标准字体)
对于表格,他们可能也在定义默认的全站点边界和对齐方式……例如
Table { border: dashed 1px #333333; padding: 2px; }
但是,如果您在表格中有一个表格(从RSolberg的示例中,在DataGrid中有一个AJAX日历),那么您的父级&嵌套表将继承这些样式. (假设这就是为什么他们被称为Cascading)
我的问题是将样式应用于最顶层元素的最佳实践是什么,而没有子元素也继承它们.
你应该只提供一个覆盖,撤消你应用的任何样式.
例如
Table { border: dashed 1px #333333; padding: 2px; } Table Table { border: solid 0px #000000; padding: 0px; }
解决方法
如果您有这样的HTML:
<html> ... <body> <div> <div> <div> <div> </body> </html>
您可以使用子选择器(>)将样式仅应用于body元素的子div,如下所示:
body > div { border:solid 1px orange; }
嵌套的div不会获得边框.
欲了解更多信息,请访问:http://www.w3.org/TR/CSS2/selector.html#child-selectors.
请注意,Internet Explorer 6不支持子选择器.