CSS font-size 文字大小 - Wibibi

文章推薦指數: 80 %
投票人數:10人

設定文字大小算是CSS 中經常用到的技巧,很少人會完全不設定網頁文字的大小,在CSS 中設定文字大小可以使用font-size 的語法,可以給的値有很多,像是數字+單位、 首頁 HTML HTML5 PHP MySQL CSS CSS3 JavaScript 軟體介紹 其它 Home › CSS › CSSfont-size文字大小 CSSfont-size文字大小 設定文字大小算是CSS中經常用到的技巧,很少人會完全不設定網頁文字的大小,在CSS中設定文字大小可以使用font-size的語法,可以給的値有很多,像是數字+單位、數字+%、英文字母等,在各種不同的單位中又以px最為常用,因為px的數字範圍可以設計出細膩的文字大小差異,一般網頁內容文字約12px~16px左右,標題文字的大小約18px~22px左右,設計師可依自己的頁面風格調整數字大小,數字越大代表字體越大,以下為font-size常用單位比較表。

CSSfont-size文字大小比較表屬性值語法呈現效果px13px
16px
18px13px16px18pxem1em
2em1em2emcm1cm
1.2cm
1cm1.2cmxx-smallxx-smallxx-smallx-smallx-smallx-smallsmallsmallsmallsmallersmallersmallermediummediummediumlargelargelargex-largex-largex-largexx-largexx-largexx-largelargerlargerlarger%100%
120%
100%120%inheritinheritinheritfont-size可以繼承父層的屬性,並呈現更大或更小的尺寸,例如範例中的smaller就是比父層更小、larger是比父層更大、200%則是比父層大兩倍的意思,其中font-size:inherit的意思是繼承父層的大小,可是IE8及以前較舊的版本並不支援,所以建議不要使用。

另外,網頁的風格設計通常不只是修改文字大小而已,還可以修改文字的顏色或字型,所以font-size常常與color文字顏色或font-family搭配出不同的風格效果。

延伸閱讀CSSfont-family字型CSSfont-weight設定字體粗細 您可能會想看 CSSspan區域文字字型設計 CSSspan區域邊框顏色與樣式設計 CSSspan區域背景顏色設計 CSSdisplay:inline-block效果 CSSa連結樣式效果設計 用CSS設計出三角形圖案 CSSdisplay屬性 CSSboxmodel盒子模型 CSSlist-style列表屬性 用CSS設計HTMLbutton按鈕大小 今日熱門文章 MySQLSELECTWHEREdate等於上個月的條件判斷寫法 MySQLSELECTWHEREdate等於本月的條件判斷寫法 MySQLSELECTWHEREdate等於昨天的條件判斷寫法 PHPmysqli_set_charset函式設定字符編碼 PHP:mysqli_connect資料庫連線函式 MySQLSELECT判斷今天之前或某天之前的日期條件判斷寫法 MySQLSELECTWHEREdate等於今天的條件判斷寫法 HTMLdiv標籤 CSSAttributeSelectors屬性選擇器 替CSSspan區域增加陰影效果 即時熱門文章 MySQLSELECTWHEREdate等於上個月的條件判斷寫法 MySQLSELECTWHEREdate等於本月的條件判斷寫法 MySQLSELECTWHEREdate等於昨天的條件判斷寫法 PHPmysqli_set_charset函式設定字符編碼 PHP:mysqli_connect資料庫連線函式 MySQLSELECT判斷今天之前或某天之前的日期條件判斷寫法 MySQLSELECTWHEREdate等於今天的條件判斷寫法 HTMLdiv標籤 CSSAttributeSelectors屬性選擇器 替CSSspan區域增加陰影效果 ©Copyrightwibibi.com網頁設計教學百科基礎的網頁設計規劃、資料庫與程式設計Since2012



請為這篇文章評分?