CSS的字型與文字屬性詳解

2021-08-30 03:44:32 字數 3011 閱讀 6031

css的字型與文字屬性詳解

font-family

功能:用於改變html標誌或元素的字型,你可設定乙個可用字型清單。瀏覽器由前向後選用字型。

語法:

font-style

功能:使文字顯示為扁斜體或斜體等表示強調 。

數值:normal - 正常

italic - 斜體

oblique - 偏斜體

font-variant

功能:用於在正常與小型大寫字母字型間切換。

數值:normal - 如果該標誌繼承父元素的 small-caps 設定,則關鍵字 normal 將 font-variant 設定為正常字型。

small-caps - 把小寫字母顯示為字型較小的大寫字母。

font-weight

功能:用於設定字型灰度,生成字型的深,淺版本。

數值:正常灰度 - normal

相對灰度 - bold, bolder, light, lighter

梯度灰度 - 取值如下:100, 200, 300, 400(相當於normal), 500, 600, 700(相當於bold), 800, 900。

font-size

功能:用各種度量單位控制文字字型大小。

數值:有四種數值方式

絕對尺寸- 用具體字型大小表定義字型大小,可以取下列數值之一:xx - small, x-small, small, medium, large, x-large, xx-large。不同字型有不同的數值。

相對尺寸 - larger, smaller,產生的尺寸是相對于父容器字型大小而言的。

長度 - 用公釐(mm),厘公尺(cm),英吋(in),點數(pt),象素(px),pica(pc),ex(小寫字母x的高度)或em(字型高度)作為度量單位。

百分比 - 相對於其父元素字型大小的百分比。

font

功能:簡寫屬性,提供了對字型所有屬性進行設定的快捷方法。

語法:數值:字型屬性值為前面已列出的值,此外還可以設定行間距屬性 line-height(見文字屬性),內容的順序為:font-style; font-variant; font-weight; font-size; line-height; font-family。可省略部分屬性,屬性值間用空格分開。

letter-spacing

功能:控制文字元素字母間的間距,所設定的距離適用於整個元素。

數值:normal - 正常間距,將字元間的間距復位為所有字型和字型大小的正常? 。

長度 - 設定字間距長度,正值表示加進父元素中繼承的正常長度,負值則?去正常長度。在數字後指定度量單位如下:mm, cm, in, pt(點數), px(象素), pc(pica), ex(小寫字母x的高度), em(大寫字母m的寬度)。

line-height

功能:設定元素中文字的行間距。

數值:normal - 正常高度,通常為字型尺寸的 1-1.2倍,這是預設設定。

數字 - 設定元素中?行文字的距離為字型尺寸乘以這個數字。例如字型尺寸為10點,設定line-height為2,則間距20點。

長度 - 用標準度量單位設定間距,有些是絕對的,有些是相對的,詳見letter-spacing中的?明。

百分比 - 也字型尺寸的百分比設定間距。

text-align

功能:在元素框中水平對齊文字。

數值:left - 左對齊

right - 右對齊

center - 居中

justify - 均勻分布, 生成等長的行

text-decoration

功能:文字修飾,用於控制文字元素所用的效果,特別適用於引人注意的說明,警告等文字效果。

數值:none - 無文字修飾,預設設定。

underline - 下劃線。

overline - 上劃線。

line-through - 刪除線。

blink - 閃爍。

同一語句中可以組合多個關鍵字。

text-indent

功能:文字縮排,用於段落的第一行縮排上。

數值:長度 - 設定首行縮排的尺寸為指定度量單位,有些單位是相對的,有些則是絕對的,祥見 letter-spacing 屬性的說明部分。

百分比 - 以行長的百分比設定首行縮排量。

text-transform

功能:設定乙個或幾個元素的大寫標準。

數值:none - 不改變文字的大寫小寫。

capitalize - 元素中?個單詞的第乙個字母用大寫。

uppercase - 將所有文字設定為大寫。

lowercase - 將所有文字設定為小寫。

vertical-align

功能:垂直對齊。

數值:baseline - 對準兩個元素的小寫字母基準線。

sub - 下標。

super - 上標。

top - 頂部對齊。

text-top - 文字頂對齊。

middle - 中線對齊。

bottom - 底線對齊。

text-bottom - 字母底線對齊。

百分比 - 將線上元素基準線在父元素基準線基礎上公升降一定的百分比,和元素的 line-height 屬性組合使用。

word-spacing

功能:控制文字中元素單詞間的間距。設定的間距適用於整個元素,不能在某個單詞間插入更大或更小的間距。

數值:normal - 正常間距。

長度 - 如果長度為正,則加進從父元素繼承的正常長度,如果是負值,則減去。

CSS 字型屬性與文字屬性

二 text系列 文字屬性 記錄了一些學習css 層疊樣式表 過程當中的學習筆記 在css中,常對文字的字型進行如下四種的編輯 字型屬性 表示字型系列 font family 字型大小 font size 字型粗細 font weight 字型樣式 font style p 通過font famil...

CSS屬性(字型與文字屬性)

1.字型屬性 1 font family 把要對這個 要設定的字型都寫上,如果這個瀏覽器支援第乙個字型,則會用,如果不支援則會嘗試第二個,如果設定的字型系統都不支援則會使用系統預設的字型作為 的字型 2 字重 2.文字屬性 我這個檔案是用來幹什麼的 小強日期 全域性通用樣式 類選擇器樣式 c1 c2...

CSS字型屬性 文字屬性(4)

css字型屬性定義文字的字型系列 大小 加粗 風格 如斜體 和變形 如小型大寫字母 字型屬性 font family 定義文字的字型系列 用逗號分隔,將值用雙引號引起來 微軟雅黑 黑體 宋體 font size 設定文字的大小 預設大小16px font style 定義文字的字型樣式 值itali...