1. 程式人生 > >web前端——css樣式的複合寫法

web前端——css樣式的複合寫法

就是將好多的樣式寫在一行裡,從而減少程式碼量。

如字型的一些樣式,我們可以將文字大小、顏色、加粗等都寫在一行裡面。

具體的樣式屬性:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>標籤</title>
    <style type="text/css">
div{
font-size: 20px;
font-family: "黑體";
font-weight: bold;
color:red;
font-style
: italic; } </style> </head> <body> <div>卡特琳娜</div> </body> </html>

連寫後的樣子:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>標籤</title>
    <style type="text/css">
div{
color:red
; font: italic bold 20px "黑體"; } </style> </head> <body> <div>卡特琳娜</div> </body> </html>

font屬性的連寫是有順序的,格式是:      font  :    font-style  font-weigth font-size font-family;

寫錯位置就有可能顯示不出來了,如果不需要哪個樣式也可以不寫,比如字型大小不需要變,那我們就寫三個就可以了。