优化CSS与谷歌页面的速度正在搅乱我(Optimize css vs Google page speed is messing with me)

优化CSS与谷歌页面的速度正在搅乱我(Optimize css vs Google page speed is messing with me)

我使用谷歌网页速度，它告诉我我的CSS效率低下...

非常低效的规则（很好解决在任何页面上）：

* table.fancy thead td Tag key with 2 descendant selectors and Class overly qualified with tag * table.fancy tfoot td Tag key with 2 descendant selectors and Class overly qualified with tag

CSS规则是

table.fancy {border: 1px solid white; padding:5px} table.fancy td {background:#656165} table.fancy thead td, table.fancy tfoot td {background:#767276}

我希望页眉和页脚的背景颜色不同于表格的主体（数据表）

究其原因，效率低下？ 如何使它更有效率？

我不会在Google和Google上添加一个类。

I'm using google page speed and it's telling me my css is inefficient...

Very inefficient rules (good to fix on any page):

* table.fancy thead td Tag key with 2 descendant selectors and Class overly qualified with tag * table.fancy tfoot td Tag key with 2 descendant selectors and Class overly qualified with tag

The css rules are

table.fancy {border: 1px solid white; padding:5px} table.fancy td {background:#656165} table.fancy thead td, table.fancy tfoot td {background:#767276}

I want the header and footer in a different background color than the body of the table (a data table)

On what grounds this is inefficient? How to make it more efficient?

I will not add a class to the thead and tfoot for googles's sake.

最满意答案

谷歌的页面速度表明，指定2个后代是低效的，这可能是事实，但我怀疑它会对最终用户的体验产生任何影响。 另一方面，有时你必须用这种方式去做你想做的事。 其他时候，这是让CSS更易于阅读和维护的问题。

最终它是你的CSS，所以做你想要的。 我认为微型优化不重要。

另见： 这个问题

Google's page speed says that specifying 2 descendants is inefficient, which may be true, but I doubt it'll make any difference on the end-user's experience. On the other hand, sometimes you have to use this way to do what you want. Other times, it's a matter of making the CSS easier to read and maintain.

Ultimately it's your CSS, so do what you want. I don't think that micro-optimization will matter.

See also: this question