css-selectors - 理解 CSS Lint 警告

Question

我正在为我们的网站编写 CSS，我只是通过 CSS Lint 运行它。我正在努力理解很多警告，因此社区的帮助会很大。

1. 不要在选择器中使用 ID。

   这不就是ID的意义吗？用于处理页面上的特定元素？

2. 选择器中有 2 个 ID，真的吗？

   有没有更好的方法来选择一个元素而不是在同一行中使用两个选择器？

3. 破盒模型：使用带边框的高度。

   我不知道这是什么意思。我的理解是盒子高度与边框高度是分开的。我已经为元素定义了一个高度，然后分别定义了边界边，我哪里出错了？

4. 标题 (h1) 不应被限定。

Answer 1

我没有使用过 CSS Lint，所以我不确定其中的大部分。但是关于 2.，“选择器中的 2 个 ID”，我猜他们会标记它，因为它可能是多余的。ID 选择器指示该元素在页面上是唯一的。因此，如果您在选择器中使用两个 ID，例如#main #navigation，您可能同样容易使用最后一个 ID，例如#navigation。

但是，如果您使用较高的 ID 来指示您当前所在的页面类型，那对我来说很好。

有很多善意的 CSS 人都非常热衷于告诉你应该做什么和不应该做什么，不管你想做什么。

Answer 2

如果您通过http://csslint.net/about.html，它会显示以下内容：

1. 不要在选择器中使用 ID

ID 不应该在选择器中使用，因为这些规则与 HTML 耦合太紧密，没有重用的可能性。最好在选择器中使用类，然后将类应用于页面中的元素。

2. 当心破盒模型

边框和填充在元素内容之外添加空间。设置宽度或高度以及边框和填充通常是一个错误，因为您不会得到您正在寻找的视觉结果。CSS Lint 在规则使用宽度或高度以及填充和/或边框时发出警告。

我认为制作 ID 是有原因的，如果您计算正确，则无需担心损坏的盒子模型。