[分享]css两个类并集

CSS中使用类的并集可以同时选择多个类名使用相同的样式。

/* 两个类的并集 */
.class1.class2 {
  /* 样式 */
} 

例如：

/* class1和class2的并集 */
.blue.bold {
  color: blue;
  font-weight: bold;
} 

将会选择同时具有class1和class2的元素，这些元素将被设置为蓝色且加粗。

类的并集可以一直组合下去，同时选择多个类名使用相同的样式：

/* 三个类的并集 */
.class1.class2.class3 {
  /* 样式 */
} 

例如：

/* class1、class2和class3的并集 */
.green.bold.underlined {
  color: green;
  font-weight: bold;
  text-decoration: underline;
} 

将会选择同时具有class1、class2和class3的元素，这些元素将被设置为绿色、加粗且带下划线。

需要注意的是，类名前面必须要加上“.”，否则就会被视为选择器了。

/* 错误的写法 */
class1.class2 {
  /* 样式 */
} 

类的并集是CSS中非常重要的一种选择器，可以方便我们快捷地设置多个类名相同的元素样式。