在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),如果沒有設置圖片,則為純色背景。
通過將兩個或多個屬性組合在一起,可以使我們的代碼變得更加簡單、易懂,同時也大幅度節省了代碼量。因此,在實際開發中,我們應該盡量利用這個特性來進行樣式命名。
上一篇css兩個li并排
下一篇Css兩個table對齊