为什么在写css时尽量使用class而不使用id来标记元素

虽然一直以来写css代码都是用得class类名来标记元素，但这更多是自己的习惯，今天对这个问题做个分析总结。

下面是为什么这么做的具体原因

一：元素的class类名可以有很多个，而id名只能有一个。通过给一个元素添加多个class类名，可以更为灵活的控制元素的样式

<div class="size color"></div> //尺寸为200 * 200,背景颜色为pink
.size {
    width: 200px;
    height: 200px;
}
.color {
    background: pink;
}

　<div id="size color"></div> //不能识别样式

#size {
    width: 200px;
    height: 200px;
}
#color {
    background: pink;
}

二：class和id的优先级不一样，混合使用可能会导致整体dom结构的样式杂乱，在后期的代码维护上造成很大的不便利。

css全称为层叠样式表，从名字出发，在写css代码时要尽量利用dom元素的层级结构来实现不同元素的样式效果，尽量避免定义元素的优先级比如!important以及id和class混用等手段。

三：具有相似样式的元素可以使用相同的class类名定义样式，减少代码量，而id只能用在一个元素上。

原文地址：https://www.cnblogs.com/zhaozhipeng/p/9324836.html