p {
font-family: "Microsoft Yahei";/*微軟雅黑*/
}
/*當然也可以寫成中文,建議寫成英文*/
p {
font-family: "Microsoft Yahei","宋體";
}
注:
/*最常見的幾個字體*/
body {
font-family: "Microsoft Yahei",tahoma,arial,"Hiragino Sans GB";
}
p {
font-size: 18px;
}
注:
p {
font-weight: 400;/*不加粗*/
}
屬性值 | 描述 |
---|---|
normal | 默認值(不加粗) |
bold | 粗體 |
100~900 | normal=400,bold=700,注意數(shù)字后不用帶單位 |
實際開發(fā)中更喜歡用數(shù)字表示粗細。
p {
font-style: italic;/*斜體*/
}
屬性值 | 作用 |
---|---|
normal | 默認值,標準的字體樣式 |
italic | 斜體 |
平時很少給文字加斜體,反而要給斜體標簽(em、i)改為不傾斜字體。
把上面的各個屬性綜合來寫成一行代碼。
body {
font: font-style font-weight font-size/line-height font-family;
}
注:
p {
color: blue;
}
color的屬性值有下列表示形式。
表示形式 | 屬性值 |
---|---|
預定義的顏色值 | red、yellow、blue等 |
十六進制 | #FFFFFF、#FF6600等 |
RGB代碼 | rgb(255,0,255)或rgb(100%,0%,100%) |
十六進制形式:
十六進制顏色代碼以#號開頭,三組16進制數(shù)字表示red,green,blue三色,每組數(shù)字從0到FF。
RGB代碼:
在RGB顏色模式中,顏色由三個值表示,表示組件的強度,紅色、綠色和藍色。
從最小值0到最大值255,當所有顏色都以最小值0顯示時,顏色為黑色,當所有顏色都以最大值255顯示時,顏色為白色。
開發(fā)中最常用的是十六進制形式。
用于設置元素內文本內容的水平對齊方式。
div {
text-align: center;
}
屬性值 | 作用 |
---|---|
left | 左對齊(默認) |
right | 右對齊 |
center | 居中對齊 |
用于規(guī)定添加到文本的修飾。
div {
text-decoration: none;
}
屬性值 | 作用 |
---|---|
none | 沒有裝飾線,默認值。(最常用) |
underline | 下劃線,鏈接a自帶下劃線。(常用) |
overline | 上劃線(幾乎不用) |
line-through | 刪除線(不常用) |
通常用在取消鏈接a默認的下劃線,如下。
a {
text-decoration: none;
}
用于指定文本第一行的縮進,通常是將段落的首行縮進。
p {
text-indent: 10px;/*也可以是負值,效果為第一行向前突出*/
}
通常的段落首行縮進兩個字可以寫成如下。
p {
text-indent: 2em;
}
em就是當前元素font-size的一個文字的大小。如果當前元素沒有設置大小,則會按照父元素的一個文字大小。
用于設置行間的距離(行高)。
p {
line-height: 26px;
}
所以行間距=上間距+文本高度+下間距。
要想實現(xiàn)文本在一個HTML元素中上下居中對齊,則讓行間距=HTML元素的高度即可。
聯(lián)系客服