css代码重复优化 |css宽度120像素

一种方法是使用CSS预处理器，比如Sass和Less。它们允许大家使用变量和混合器，可以大大减少代码的重复。例如，大家可以定义一个颜色变量，然后在整个样式表中使用它，而不必每次使用时都输入相同的颜色值。

$primary-color: #007bff;
.button {
background-color: $primary-color;
color: white;
border: none;
padding: 10px 20px;
}
.card {
background-color: $primary-color;
color: white;
border-radius: 5px;
}

这样做，不仅可以避免代码的重复，而且如果大家需要改变主题颜色，则只需要更改变量的值即可。

另一种方法是将相同的样式合并成一个类，然后在HTML中使用该类名称多次。这种方法可以减少代码重复，但也可能导致HTML代码的冗余。所以，在使用此方法时需要权衡利弊。

.button {
background-color: #007bff;
color: white;
border: none;
padding: 10px 20px;
}
.card {
background-color: #007bff;
color: white;
border-radius: 5px;
}

无论大家选择哪种方法，减少CSS代码的冗余是非常重要的，这样可以使大家的代码更简洁，易于维护，同时也可以提高网页的加载速度。