css字體樣式
font-size : 字體大小
font-size屬性用於設置字號,該屬性的值可以使用相對單位長度,也可以使用絕對單位長度。
相對長度單位 | 說明 |
---|---|
em | 相對當前對象內文本的字體尺寸 |
px | 像素 最常用 推薦使用 |
絕對長度單位 | 說明 |
in | 英寸 |
cm | 厘米 |
mm | 毫米 |
pt | 點 |
font-family:字體
font-family屬性用於設置字體。網頁中常用的字體有宋體、微軟雅黑、黑體等,例如將網頁中所有的段落文本的字體變黑,可以使用css樣式代碼: p {font-family: "微軟雅黑";}
1.現在網頁中普遍使用14px+。
2.盡量使用偶數字號的字體.ie6等老數瀏覽器支持奇數號字體有bug
3.各種字體之間必須使用英文狀態下的逗號隔開。
4.中文字體需要加英文狀態下的符號,英文字體一般不需要加引號。當需要設置引英文字體時,英文字體名必須位於中英文字體名之間。
5.如果字體名中包含空格、#、$等符號時,則該字體必須加英文狀態下的單引號或雙引號,如`font-family:"times new roman"`
6.盡量使用系統默認字體,保證在任何用戶瀏覽器中都能正確顯示
unicode字體
瀏覽器 兼容性好,去編碼表中查看對用字體
font-weight:粗細
- bold:加粗
- normal:正常
- bolder:特粗體
- lighter:細體
- 400:相當於normal 正常
- 700:相當於bold 加粗
font-style:字體樣式
- normal:正常
- italic:斜體
- oblique:傾斜的字體
字體連寫
- 格式:
選擇器 {font:font-style font-weight font-size/line-height font-family;}
- font-size和font-family是必寫項
字體的外觀屬性
color:文本顏色
color屬性用於定義文本的顏色,其取值方式有3中:
- 預定義顏色值:如red、green、blue等
- 十六進制,如#FF0000、FF6600等
- RGB代碼,如紅色可以用rgb(255,0,0)
line-height:行間距
line-height屬性用於設置行間距,就是行與行之間的距離,即字符的垂直間距,一般為行高。常用的屬性值單位有三種,分別為像素px,相對值em和百分比%,實際工作中使用最多的就是像素px
text-align:水平對齊方式
text-align屬性用於設置文本內容的水平對齊,相當於html中align對齊屬性
- left:左對齊
- right:右對齊
- center:居中對齊
text-indent: 段落首航縮進
text-indent:2em
- em:一個字的距離
text-decoration 文本的裝飾
text-decoration 通常我們用於給鏈接修改裝飾效果
值 | 描述 |
---|---|
none | 默認,定義標准的文本 |
underline | 定義文本下的一條線。下划線 也是我們鏈接自帶的 |
overline | 定義文本上的一條線 |
line-through | 定義穿過文本下的一條線 |