在CSS中使用ID作为“模块”被认为是不好的做法吗？

Question

我知道很多人都会在你的造型中反对使用ID，因为它们会增加太多的特异性。

但是，如果您正在使用可放置在任何页面或任何容器上的组件，如果小心使用，这不是一件好事吗？我忽略了什么吗？

我做的最后一个项目我使用SMACSS方法模块化一切。除了那些我不得不故意添加额外特异性的情况外，这种方法效果很好。

使用SCSS的示例：

#myWidget {
  .foo { 
    width: 150px;
  }
  ...
}

在某些情况下，这可以被公平地覆盖

.myWidget {
  .foo {
    width: 150px;
  }
}

Answer 1

一般规则是，ID只应出现在页面上一次（#main-navigation表示包含您网站导航的<div>）并且类可以多次出现在页面上（{例如，{1}}给一些文字一个红色。我个人倾向于使用ID来分隔不同的容器级别部分，而类可以更普遍地应用。

您的示例不包含有效的CSS但是......您需要像这样编写它们：

.red-text

或

#myWidget .foo { 
    width: 150px;
}