在CSS中,我们可以将两个或多个属性组合在一起,这种特性被称为复合属性。其中,比较常见的两个属性组合有:font和background。这样的组合可以让我们更方便地修改样式,缩短代码的长度。
下面是一个例子,展示如何一起命名font
属性:
font: italic bold 14px/1.5 Arial, sans-serif;
上面的font
属性包括着样式规则:font-style
、font-weight
、font-size
、line-height
和font-family
。在这个示例中,我们设置了斜体(italic)、粗体(bold)的14像素字号,1.5倍的行高,字体为Arial,如果找不到则使用sans-serif作为后备字体。如果要按照固定值来命名,可以使用:font: 16px Times, serif;
,将对应的属性值填入即可。
同样地,我们也可以一起命名background
属性,如下所示:
background: #f2f2f2 url("bg.jpg") no-repeat top left;
上面的background
属性包含background-color
、background-image
、background-repeat
、background-attachment
和background-position
这五个子属性的属性值。在这个示例中,我们设置了背景颜色(#f2f2f2)、图片URL("bg.jpg"),不重复(no-repeat)并将图片放置在左上方(top left)。如果没有设置背景颜色,则默认为透明(transparent),如果没有设置图片,则为纯色背景。
通过将两个或多个属性组合在一起,可以使我们的代码变得更加简单、易懂,同时也大幅度节省了代码量。因此,在实际开发中,我们应该尽量利用这个特性来进行样式命名。