说到CSS，”.”和”#”这俩点可是老大了！这两家伙长的差不多，但用处可不一样！快来看看它们到底有什么区别，让你能更顺手地使用它们！
1. 选择器的语法结构不同
首先，记住这点儿事儿，就是点里.”开始的叫类选择器，”#开头的就叫ID选择器举例来说，如果你想搞点儿样式给那个class名叫做”example”的东西，那么就要这么来：
css
.example {
color: red;
}
要找那个叫”example”的小伙伴的话，可别忘了用#号。
.example {
color: red;
}
#example {
color: blue;
#example {
color: blue;
}
看到了，虽然都是找元素，但用的符号可不一样。
2. 权重不同
，你知道吗？在CSS里，每种选择器都类似于卡通世界的每个角色，它们扮演着不同的角色，拥有各自的“能量”和“势力范围”。比如说，那个神奇的id选择器就是“老大”级别的角色，它只存在一处，能够管理它能触及到的所有东西。再来说说class选择器，虽然也是个重要角色，但它就像是个“小弟”，因为一个class可以被很多元素使用，所以它的影响力相对较弱。
3. 适用范围不同
类跟ID可不一样！类就像一个大布袋子，把类似的东西塞进去方便管理；但用ID时得挑选特别的来装饰，好像只偏爱某一件物品。
4. 使用场景不同
类和id，概念不同，用途也需针对物品特点来选。 一般情况下，用类的话能让你更快地完成工作；可是要是要特别照顾某个元素，那么用 id 可能更适合。
5. 复用性不同
类选择符真好用！一套就可以搞定好几个元素，一眼看去，所有东西都整齐划一。再说ID，虽然唯一，但要是想复刻，可不是随便就能行的。就跟挑衣服似的，类选择符就像我们常穿的那款大众潮流；而ID选择符就好像是私人订制，只有你自己才能穿出味道来。
6. 维护性不同
大家要知道，调试css代码时，用class选和id选有点小差异。Class选可以随便套用到多个元素上，但是调了样式后，其他位置一不留神就会受牵连，得小心翼翼；不过，id选就不用担心这问题！因为每一个id都是唯一的，更换时完全无需顾虑其他元素的情况，方便快捷得多~
7. 扩展性不同
想让网页看起来更酷吗?试试类选择器吧!瞬间就能提升逼格~再来瞅瞅ID选择器,它够个性,但扩展性不大行呢.
8. 性能差异
p {
font-size: 16px;
font-weight: bold;
}
得记住，虽然用ID选择器能稍微快点儿，但也别乱用。数目太多了，以后样式加起来可麻烦！
9. 最佳实践
真不吹牛，搞编程要根据自己的需求选 CSS 选择器。有些时候就是一堆东西都用一样的那种样式，这时候就选类选择器；但要是想照顾某个特殊元素，ID 选择器合适不过了。记得，代码得清晰明了，便于后期维护，千万别滥用 ID 选择器！
#page-header {
font-size: 24px;
color: #000;
}
10. 小结
说到底，类别和ID都是可用的选择器，只不过它们功能各异，比如选哪个元素，哪个效果更霸道点儿，适用于什么场合等这些问题咯。所以，做网页设计的时候得看清楚哪种最适合自家需求，这样才能做出好看又顺手儿的网页来！
来了大家都来，咱们平时是喜欢用ID呢还是类别来进行项目管理？快来说说呗！记得别忘了给我点个赞！
评论0