[分享]css两个类同时起作用

在CSS中，我们可以给元素添加多个class，这样就可以同时应用来自不同类的样式。

/* 定义类class1 */
.class1 {
  background-color: blue;
  color: white;
}

/* 定义类class2 */
.class2 {
  font-size: 18px;
}

/* 在HTML中应用class1和class2 */
<div class="class1 class2">这个div将应用class1和class2的样式</div> 

在上面的代码中，我们定义了两个类class1和class2，class1将应用蓝色背景和白色字体颜色，class2将应用18px的字体大小。在HTML中，我们将这两个类同时应用到一个div元素中，这样div元素将同时应用两个类的样式。

需要注意的是，如果两个类定义了相同的属性，最后应用的将是在HTML中后定义的类的属性。

/* 定义类class1 */
.class1 {
  font-size: 14px;
}

/* 定义类class2 */
.class2 {
  font-size: 18px;
}

/* 在HTML中应用class1和class2 */
<div class="class1 class2">这个div将应用class2的字体大小，即18px</div> 

在上面的代码中，class1和class2都定义了字体大小属性，但是在HTML中最后应用的是class2的属性，即18px的字体大小。