•字體是「文字的不同體式」或者「字的形體結構」,例如宋體/黑體/行楷等。•文本就是一組字或字符,比如章標題、段落正文等等,跟使用什麼字體無關。•CSS 為字體和文本分別定義了屬性。字體屬性主要描述一類字體的大小和外觀。比如,使用什麼字體族(是 Times,還是 Helvitica),多大字號,粗體還是斜體。文本屬性描述對文本的處理方式。比如,行高或者字符間距多大,有沒有下劃線和縮進。
字體網頁中的字體有三個來源:
•用戶機器中安裝的字體•保存在第三方網站上的字體。最常見的是 Typekit 和 Google,可以使用 link 標籤把它們連結到你的頁面上•保存在你的 Web 伺服器上的字體。這些字體可以使用@font-face 規則隨網頁一起發送給瀏覽器
字體的屬性•font-family•font-size•font-style•font-weight•font-variant•font(簡寫屬性)
字體族font-family:用於設定元素中的文本使用什麼字體 注意: 如果字體系列的名稱超過一個字,它必須用引號,如Font Family:"宋體"。
字體大小font-size:用於設置字體的大小
絕對字體大小使用像素(px),派卡(pica)或者英寸。設定絕對字體大小時,也可以使用關鍵字值,比如 x-small、medium、x-large,等等。
相對字體大小使用百分比、em 或 rem(根元素的字體大小)設定字體大小。如果你給某個元素設定了相對字體大小,則該元素的字體大小要相對於最近的「被設定過字 體大小的」祖先元素來確定
字體的樣式值:italic、oblique、normal。示例:h2 {font-style:italic;}
字體的粗細可能的值:100、200……900,或者 lighter、normal、bold 和 bolder。示例:a {font-weight:bold;}
字體的變化值:small-caps、normal。示例:blockquote {font-variant:small-caps;}。這個值會導致所有小寫英文字母變成大寫字母。
簡寫字體屬性規則一:必須聲明 font-size 和 font-family 的值。規則二:所有值必須按如下順序聲明。
1.font-weight、font-style、font-variant 不分先後;2.然後是 font-size;3.最後是 font-family。
示例 p {font: bold italic small-caps .9em helvetica, arial, sans-serif;}
示例文本文本屬性text-indent(文本縮進)值:長度值(正、負均可)。示例:p {text-indent:3em;}。
letter-spacing(字符間距)值:任何長度值(正、負值均可)。示例:p {letter-spacing:.2em;}。
word-spacing(單詞間距)值:任何長度值(正、負值均可)。示例:p {word-spacing:.2em;}。
text-decoration(文本裝飾)值:underline、overline、line-through、blink、none。示例:.retailprice {text-decoration:line-through;}。
text-align(文本對齊)值:left、right、center、justify。示例:p {text-align:right;}。
line-height(行高)值:任何數字值(不用指定單位)。示例:p {line-height:1.5;}
text-transform(文本轉換)值:none、uppercase、lowercase、capitalize。示例:p {text-transform:capitalize;}。
vertical-align(垂直對齊)值:任意長度值以及 sub、super、top、middle、bottom 等。示例:span {vertical-align:60%;}。
示例如果文章能夠對您有所幫助,我便感到十分榮幸。如若文章能被您點讚,那便是萬分榮幸~