在 CSS 中减少代码冗余是基本优化策略,具体来说就是减少代码重复性以及
提高代码可维护性。即开发的 CSS 代码既要短小精悍,又要易于理解后期修改维
护。常见的思路为关联值采用关系表达,而非直接数据值。这样当某些值在设计
中存在相互依赖关系时,用代码将其相互关系表达出来。当后期修改维护时,仅
仅只需要修改其中的一项参数即可实现修改多项代码参数的目的。下面以最常用
的按钮代码为例进行说明。
<input type='button' class='button_start' value='二狗哥'>
box-shadow: 0 1px 5px gray;
color: white;
text-shadow: 0 -1px 1px #335166;
font-size: 20px;
(1)行高(line-height)30px 是字体大小(font-size)20px 的 1.5 倍。
这两者关联一起,即便需要按钮放大缩小能后期修改维护时,仍能确保视觉效果
一致性。