CSS字體、文本樣式屬性

1、字體屬性

CSS-Fonts（字體）屬性用於定義字體系列、大小、粗細、和文字樣式（如斜體）。

1.1、修改字體樣式屬性

CSS使用 font-family屬性來定義字體

語法：

p {
 font-family：『宋體』;
}

• 多種字體之間必須使用英文狀態下的逗號隔開。
• 一般情況下，如果有空格隔開多個單片語成的字體，加引號。
• 盡量使用系統默認自帶字體，保證在任何用戶的瀏覽器都可以顯示。

1.2、字體大小屬性

CSS使用 font-size屬性來定義字體

語法：

p {
	font-size: 20px;
}

• px（像素）大小是頁面常用單位
• 可以給body指定大小。

1.3、字體粗細屬性

CSS使用 font-weight屬性來定義字體粗細。

• 加粗是700或者bold 不加粗是normal或者400 數字不能跟單位。
• 一般用的是數字定義字體的粗細，比較的方便。

p {
	font-weight= 700;
}

1.4、字體樣式屬性

CSS使用 font-style屬性來定義字體是否傾斜。

p {
	font-style: normal; //不傾斜
}

• normal 默認值，不傾斜。
• italic 傾斜字體

1.5、字體複合屬性

字體複合屬性(簡寫)font可以把以上文字的樣式綜合來寫，可以節約代碼。

• 字體複合屬性必須按照font: font-stylt(字體是否傾斜) font-weight（字體粗細）font-size/line-height（字體大小/行高）font-family（哪種字體）的順序。
• 必須嚴格按照順序書寫，不能更換順序，並且各個屬性之間用空格隔開。
• 不需要設置的屬性可以省略，但是字體大小和何種字體不能省略

p {
	font: italic 700 16px 'Microsoft yahei';
}

2、文本外觀屬性

CSS Text（文本）屬性可以定義文本的外觀，比如文本的顏色，對齊文本，裝飾文本，文本縮進，行間距等。

2.1、文本顏色

corder屬性：定義文本的顏色。

div {
	corder：red;
}

表示方式屬性值預定義顏色值red，green，blue，pink十六進位#FF0000，#FF66000，#29D794RGB代碼rgb(255,0,0)或（100%，0%，0%）

開發者最常用的是十六進位。

2.2、對齊方式

text-align屬性用於設置元素內文本內容的水平對齊方式。

div {
	text-align：center;
}

屬性樣式left左對齊（默認值）right右對齊center居中

2.3、裝飾文本

text-decoration屬性規定添加到文本的修飾。可以給文本添加下劃線，刪除線，上劃線。

a {
	text-decoration: none; //取消a默認的下劃線
}

屬性值樣式none默認無裝飾線underline下劃線。overline上劃線（幾乎不用）line-through刪除線（不常用）

• 一般用於刪除a標籤默認的下劃線

2.4、文本縮進

text-indent屬性用來指定文本的第一行的縮進，通常是將段落首行縮進。

div {
	text-indent: 10px;
}

通過該屬性，可以讓元素的第一行都縮進一定的長度。

p {
	text-indent: 2em;
}

em是一個相對單位，就是當前元素的1個文字的大小，如果當前元素沒有設置大小，則會按照父元素的1個文字大小。

2.5、行間距

line-height屬性用於設置行間的距離（行高），可以控制文字行與行之間的距離。

p {
	line-height: 26px;
}