CSS 文字屬性

一.字體 font-family

兩大類的字體定義:

1.family-name 字型名稱:Arial, Time New Roman, 新細明體, 細明體, 標楷體

2.generic-family汎用字集:serif(襯線字), sans-serif(無襯線字),cursive(捲曲字體),fantasy(花俏字
體),monospace(等寬字體)



Font Family 定義方式:

定義一集合(數個)字型當作備用 ,若瀏覽器不支援第一字型,則使用第二字型,依此類推。

若字型名稱超過一個WORD須用雙引號括起來 , 不同字型間用逗號隔開 , 結尾用泛用字體。

p{font-family:"新細明體", "Times New Roman", Times, Sans-serif;}

二.字體大小font-size

不要用字體的大小來區分何者為標題,何者為文章段落;

應使用<h1> ~ <h6> 標示標題 , <p> 標示段落。



絕對大小:   指定文字特定大小 ; 無法由瀏覽器變更字體大小。

相對大小:   指定相對於周邊元素的大小 ;可由瀏覽器變更字體大小。

若未指定字體大小,預設字體大小為normal text , <p>為16px  (16px=1em)

1.使用Pixelx指定大小 :  

 p {font-size:14px;}

2.使用Em指定大小, 預設1em=16px

  pixels 轉換 em 公式: pixels / 16 = em

  ex: 40px / 16 = 2.5em

   h1 {font-size:2.5em;}

3.結合Percent 和　Em

body {font-size:100%;}

h1 {font-size:2.5em;}
h2 {font-size:1.875em;}
p {font-size:0.875em;}

可在所有瀏覽器正常執行,可由瀏覽器改變字型大小。