Question

我不知道链接是否是正确的术语我谈论这样的编码：

    html > body > div > ul > li > a{
        /*css*/
    }

我和我的一位朋友谈过，他告诉我这样编码css在渲染css时在浏览器上表现不佳。
这是真的还是我真的应该只声明类/ id并指定它们？

Answer 1

您应该尽可能具体，以便定位您的元素。使用id是可取的。

最终，这种微观优化是相当无关紧要的。只有你已经优化了所有东西其他（压缩图像，提供静态内容，使用css sprites，最小化资产等），才值得一看。

Answer 2

在我看来，您应该使用所需的最少数量的选择规则。规则越多，处理的时间就越长。

所以是的，更好的做法是使用类和ID。

同样是您在上面给出的示例，如果您尝试将CSS应用于所有标记，只需

即可正常工作

a {
/* css */
}

Answer 3

浏览器从右到左阅读CSS，这意味着在您的示例中，浏览器会查找所有<a>，然后查找父<li>，直到达到<html>

所以对表现来说，这种写作风格对表现不利。

Answer 4

如果您只想申请某个元素中的元素，可以尝试这样的事情：

#ullID li{ ... }

通过这样做，您可以在#ullID元素中设置li标记的样式。如果你想更深入，你可以这样做：

#ullID li a{ ... }

我认为与使用相反，这将是更快的性能：

 html > body > div > ul > li > a{ ... }

希望这会有所帮助：）

Answer 5

以下是选择器优化的粗略近似：

当谈论aboult SEO时，这是要记住的事情。这并不意味着你必须忘记所有这些并且只使用classe和id's。问题是，当你说div #child ul li a img浏览器首先关注和img时，看看它是否有一个a父级有li父级等等。