CSS级联样式的不同填充值

Question

如果我这样做：

*{padding:0}
div#myDiv{padding:10px;}

这种行为会像CSS中的任何正常样式一样，最后一种样式会覆盖其他样式吗？即具有myDiv ID的元素将具有10px填充？或者我必须指定！important？

这适用于所有流行的浏览器吗？

谢谢！

Answer 1

是：<div id="myDiv">元素将具有10px填充，这几乎适用于所有浏览器。级联意味着更具体的选择器将覆盖更多的通用选择器。

您真正需要使用!important的唯一时间是，当您拥有一个更通用的样式时，您希望优先于更具体的样式，或者当您为同一个选择器设置两种不同的样式时，喜欢利用不支持!important的旧浏览器中的怪癖。

Answer 2

如果声明为

div {padding: 30px;}
div#pro { padding: 0px; }

除了div #pro之外，每个div都会有30px的填充，不管样式表的顺序如何，它都取决于你对声明的具体程度。更一般的规范被更具体的规范所覆盖。

Answer 3

旧版浏览器不支持all（*）选择器。我相信所有现代浏览器都支持它。

至于你在#myDiv上的特定填充，这应该有效。 CSS中的级联意味着元素从父级继承属性，但是这些属性可以被更具体的选择器覆盖子元素。

如果您想重置或规范化所有crossbrowser CSS，请尝试使用Eric Meyers重置css sheet。我在所有CSS模板中使用此文件作为开头。这是一个很大的帮助。 Als一定要将XHTML strict定义为doctype，这样可以为你节省更多的灵魂。

Answer 4

我不建议这样做。如果你想默认将所有元素的填充设置为零，我建议使用css reset页面

但是，那会有效。