CSS font | 台灣咖啡館
等寬體monospace.等寬字體表示所有的字母、數字都是同樣的寬度,對於中文而言,每個字在設計上大多都是等寬,但英文就不同了,例如說W和i的寬度就差很多,這也造成 ...
字體,是網頁排版中最重要的元素之一,本篇文章將會針對 CSS 的 font-family 進行詳細介紹 ( 包含 generic-family、font-face、unicode...等 ),希望幫助大家在跨平台瀏覽或是做些特殊排版時,能更輕鬆的使用網頁字體,能讓網頁內容更清楚更精彩。
如果對字體的單位有興趣,可以參考:一次搞懂 CSS 字體單位:px、em、rem 和 %[1]
基本用法使用 font-family 很簡單,只需要設定 family-name ( 字體名稱 ) 和 generic-family ( 通用字體 ),font-family 可以設定一種字體或多種不同的字體,每種字體間用半形逗號「,」隔開,當瀏覽器載入網頁樣式時,會從左邊第一個字體開始判斷,如果沒有對應的字體,就直接採用下一種字體,如果到最後都沒有可用的字體,就採用電腦預設字體,這時就可以透過 generic-family 來指定哪種預設字體。
舉例來說,下面這行 CSS,會先找第一種字體,若不支援或沒有該字體,則採用第二種字體,依此類推,最後使用通用字,從下方例子亦可以看到,字體名稱時不用加上雙引號,但如果你的字體名稱中間空格,就一定要加上雙引號。
body{ font-family:第一種字體, 第二種字體, "第三種 字體", "通用字"; } generic-family 通用字上面提到了 generic-family 這個專有名詞,翻譯成中文就是「通用字」,也就是在作業系統中完全找不到對應字體預設會顯示的字體,因此通用字會寫在 font-family 的最後面,作為最終的選項,當然不設定通用字也是可以,屆時將自動採用系統預設字體,也會導致不同作業系統顯示的結果有所不同。
常用的通用字有五種,分別是 sans-serif ( 無襯線體 )、serif ( 襯線體 )、monospace ( 等寬體 )、cursive ( ...
CSS font | 台灣咖啡館
CSS | 台灣咖啡館
Monospaced Font | 台灣咖啡館
中文等宽字体(Monospace Chinese Font Family) | 台灣咖啡館
固定寬度字型 | 台灣咖啡館
寫程式專用字型與中文測試– 大丙的筆記Dabinn's Note | 台灣咖啡館
寫程式時好用的字體字型比較與推薦 | 台灣咖啡館
思源黑體修改版「思源柔黑體」字型免費下載 | 台灣咖啡館
等宽字体 | 台灣咖啡館
等寬字體 | 台灣咖啡館
台中市【Monospace 共同工作空間】沒有時間限制、有插座
咖啡廳名稱:Monospace共同工作空間縣市:台中市詳細地址:台中市西區臺灣大道二段2號16F-2營業時間:用餐是否有限時:沒有...
台北市【SD Coworking Plaza】沒有時間限制、有插座
咖啡廳名稱:SDCoworkingPlaza縣市:台北市詳細地址:台北市中山區合江街102巷18號營業時間:周一到周五9:00-18:00(18:00...