在使用CSS样式时,我们常常会遇到重复的代码,这无疑增加了代码量,而且也不利于维护。此时我们可以通过抽出公共部分来解决这个问题。 .box1 { width: 200px; height: 200px
在使用CSS样式时,我们常常会遇到重复的代码,这无疑增加了代码量,而且也不利于维护。此时我们可以通过抽出公共部分来解决这个问题。
.box1 { width: 200px; height: 200px; border: 1px solid #ccc; margin: 10px; background-color: #f1f1f1; } .box2 { width: 300px; height: 300px; border: 1px solid #ccc; margin: 10px; background-color: #f1f1f1; }
以上是两个不同的样式,但是有很多相同的地方,如宽度、高度、边框、边距和背景颜色等。我们可以将这些公共的样式放在一个单独的样式中。
.common-style { border: 1px solid #ccc; margin: 10px; background-color: #f1f1f1; } .box1 { width: 200px; height: 200px; } .box2 { width: 300px; height: 300px; }
这样我们就把公共的样式抽了出来放在了一个单独的样式中,使得代码更加简洁和易于维护。
粉丝
0
关注
0
收藏
0