为什么要写所有标签来分配一种样式比使用通用选择器(*)更好？

Question

可能重复:
为什么CSS重置不使用'*'来覆盖所有元素？

我正在做一个具有轻量级HTML的页面.

我见过大师说普遍选择器是一件坏事,最好这样使用(来自:http://meyerweb.com/eric/tools/css/reset/):

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

使用通用选择器:

* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

为什么通用选择器是一件坏事？

考虑到页面加载的性能,我更喜欢通用选择器.还有其他我不考虑的事情吗？

Answer 1

• 通用选择器的优先级低于其他已定义的规则.

  一个原因是通用选择器具有非常低的优先级,并且不能"覆盖"由更具体的选择器定义的值,请参见下面的示例.

  尽管我们想要"重置"所有元素background-color到blue选择器使用div是更合适的,并且将被替代使用,即使*稍后声明.

    div {background-color:red}
    *   {background-color:blue}

• 使用通用选择器不会授予您可能需要的控件.

  使用通用选择器不会提供对实际具有属性集的确切元素的任何控制,从显式列表中删除/添加元素比将CSS写入不重置某些项更容易.

• 使用通用选择器显然非常慢

  您提到了加载页面所需的时间,并确保如果您编写一个字符(*)而不是更多(使用备用和建议的重置),则下载所需资源的速度会更快,但是下载内容并非全部都是页面呈现的速度.

  正如Mozilla Developer网络关于通用选择器所写:

  注意:不鼓励作者使用通用选择器,因为就网页性能而言,它是最昂贵的CSS选择器.

  您可以通过以下链接阅读有关选择器昂贵的更多信息:

  • developer.mozilla.org - Universal Selectors - MDN
  • stevesouders.com - 简化CSS选择器

Answer 2

无法控制确切重置哪些元素 \xe2\x80\x93 文档中使用的每个元素现在必须明确设置其边距和填充，以及可能包含在重置中的任何其他属性，例如边框和轮廓。

\n\n

告别从父元素到子元素的 CSS 规则继承 \xe2\x80\x93 通用选择器每次都会胜出。因此，不仅每个元素必须在重置后定义，而且子元素现在无法继承每个 element\xe2\x80\x99s 属性，因此也必须显式定义它们。这所需的代码量甚至可能抵消最小 CSS 重置带来的大小节省！

\n\n

根据通用声明，浏览器必须遍历页面上的每个元素并应用通用规则：元素、它们的子元素和曾曾曾孙都一样，有些人声称这可能会对资源和资源造成巨大打击。页面加载时间（这一点对于现代浏览器来说是有争议的。）

\n\n

Internet Explorer 6 及以上版本表现出明星 HTML 选择器错误：应该失败的选择器 don\xe2\x80\x99t。后代选择器（例如 * html）不应该匹配任何元素，因为 html 元素是最顶层的父元素，因此它不能是任何其他元素的后代元素。但是，Internet Explorer 版本 5.5 和 6 忽略此选择器开头的通用选择器。

\n\n

当通用选择器紧邻元素类型选择器时，Internet Explorer 版本 6 和 7 会将组合解释为后代选择器，而不是像应有的那样失败。在 Internet Explorer 6 和 7 中，此选择器还将选择一些不适当的 SGML 元素，例如 doctype 声明和注释。

\n