包含或不包含HTML元素的css ID？

Question

在css文件中，使用带有或不带HTML元素的css ID是否更好？

例如，使用HTML元素：

div#header {
    font-size: 2em;
}

没有HTML元素：

#header {
    font-size: 2em;
}

我知道这两个例子都会做同样的事情，但我想知道这两个例子是否会影响SEO或加载时间。我倾向于使用不带 HTML元素的示例，因为这将导致较小的CSS文件，但我想知道是否有其他人对此有想法/意见/经验。

Answer 1

div#header {
    font-size: 2em;
}

仅在持有id的元素为div时才会应用。

#header {
    font-size: 2em;
}

无论元素如何都可以。

因为你通常只使用一个id，所以你通常会选择第二种方法：它可以节省字符，因此节省了一点点加载时间 - 虽然不是很明显。

如果你有几个页面使用css但是#header元素可以使用div不同#head可以用来决定哪种样式应用于哪个页面。如果是这种情况，你可能想在这里使用一个类。