今天小编跟大家讲解下有关该不该使用ID选择器？浅谈对CSS的ID选择器的使用建议 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关该不该使用ID选择器？浅谈对CSS的ID选择器的使用建议 的相关资料，希望小伙伴们看了有所帮助。
关于ID选择器和class选择器不同，这里使用#class的值不同标签可以发生重复。但是id不允许！！！id选择器不能结合使用id属性通常和js配合使用
CSS Code复制内容到剪贴板 #label{ background-color:red; }思考最近我在对 CSS 的样式进行一些性能测试，然后我的一些好友问我：为什么你不使用 IDs 来作为页面上一些特定的内容部分呢？这个问题很难回答，有下面几个理由：1.页面中的该元素无法重用2.螺旋式下降导致的特异性3.通过 IDs 用来标识一些非常特殊的内容，但牺牲了抽象性4.性能方面可通过其他方式来解决5.下面我们针对这四点进行深入探讨。
无法重用页面的元素IDs 对程序员来说相当于是单例，一个页面中不允许存在两个相同的 id（当然浏览器不会报错就是了），这就意味着你不可能重用某个元素，相当于是一对一的关系。而根据我的速度测试，如果一段 CSS 代码只对一个元素起作用对速度并不利，同时也带来了 CSS 膨胀的额外开销。
由螺旋式下降导致的特异性CSS 关于重载的两个方法：1.级联: (任何下一级的元素都可以重写上一级CSS规则)2.特异性: the idea of creating weight by using weighted selectors.为什么我说这里是一个螺旋式下降，因为为了要重载一个优先级很高的规则，我必须给它设置添加再高的优先级。
CSS Code复制内容到剪贴板 .ModuleOfficeList.property-checkboxinput{display:block;margin-bottom:8px;_border:0px!important;} .ModuleOfficeList.property-checkbox, .ModuleOfficeList.new-icon, .ModuleOfficeList.open-icon{display:block} ....uid-officelistings.property-checkbox{display:none!important;}上面是我在 2005 年的一段真实的代码，上面的代码我必须在最后使用 !important 规则来对选择器规则进行重新排序。这很不好。一旦我们这样做......它需要我们更多的时间去追捕父ID，我们将推翻当前的特异性。这是不友好的而且不利于维护，最终你会掉进入自己挖好的洞，只有重构才能摆脱这个噩梦。
另一方面：我听到少数的一些声音关于使用 ID 选择器的好
使用 ID 选择器更快是的，这一点的确没错，而且我也曾经证明过。但是性能的表现微乎其微，但当你使用嵌套其他选择器时性能就下降了：
CSS Code复制内容到剪贴板 #profile-module{...} #profile-moduleli{...} .profile-moduleli{...}第二个选择器就没有第三个来的快，因为CSS是从右到左的，因此 li 会先被扫描，因此通过 ID 进行定位将直接被忽略。关于 CSS 选择器的性能问题，请看 Steve Souders explains how selector speed works.
IDs 就是单例的意思很多人会在页面中定义 ID ，但某个元素在所有页面中只出现一次的话，用 ID 选择器是没问题的。我唯一声明的是所有代码都应该是可重用的，如果能避免还是尽量避免。
特别说明最后需要说明的是，我并不是要大家完全抛弃使用 ID，ID 可以加速 Javascript 执行，在文档中传达具体的意义。我只是不建议在 CSS 中使用 ID 选择器，当然，决定权在于你自己。
来源：爱蒂网
