华南俳烁实业有限公司

考試首頁 | 考試用書 | 培訓課程 | 模擬考場 | 考試論壇  
  當前位置:設計制作 > CSS/HTML > 文章內容
  

CSS基礎教程:CSS字體

 [ 2016年2月18日 ] 【

在 Firefox, Chrome, and Safari 中,可以重新調整以上例子的文本大小,但是在 Internet Explorer 中不行。

雖然可以通過瀏覽器的縮放工具調整文本大小,但是這實際上是對整個頁面的調整,而不僅限于文本。

使用 em 來設置字體大小

如果要避免在 Internet Explorer 中無法調整文本的問題,許多開發(fā)者使用 em 單位代替 pixels。

W3C 推薦使用 em 尺寸單位。

1em 等于當前的字體尺寸。如果一個元素的 font-size 為 16 像素,那么對于該元素,1em 就等于 16 像素。在設置字體大小時,em 的值會相對于父元素的字體大小改變。

瀏覽器中默認的文本大小是 16 像素。因此 1em 的默認尺寸是 16 像素。

可以使用下面這個公式將像素轉換為 em:pixels/16=em

(注:16 等于父元素的默認字體大小,假設父元素的 font-size 為 20px,那么公式需改為:pixels/20=em

實例

h1 {font-size:3.75em;} /* 60px/16=3.75em */
h2 {font-size:2.5em;}  /* 40px/16=2.5em */
p {font-size:0.875em;} /* 14px/16=0.875em */

在上面的例子中,以 em 為單位的文本大小與前一個例子中以像素計的文本是相同的。不過,如果使用 em 單位,則可以在所有瀏覽器中調整文本大小。

不幸的是,在 IE 中仍存在問題。在重設文本大小時,會比正常的尺寸更大或更小。

結合使用百分比和 EM

在所有瀏覽器中均有效的方案是為 body 元素(父元素)以百分比設置默認的 font-size 值:

實例

body {font-size:100%;}
h1 {font-size:3.75em;}
h2 {font-size:2.5em;}
p {font-size:0.875em;}
首頁 1 2 3 4 5 尾頁
本文糾錯】【告訴好友】【打印此文】【返回頂部
將考試網添加到收藏夾 | 每次上網自動訪問考試網 | 復制本頁地址,傳給QQ/MSN上的好友 | 申請鏈接 | 意見留言 TOP
關于本站  網站聲明  廣告服務  聯(lián)系方式  站內導航  考試論壇
Copyright © 2007-2013 中華考試網(Examw.com) All Rights Reserved
陕西省| 余江县| 三门县| 平舆县| 兴仁县| 兴义市| 邓州市| 手游| 大邑县| 巩义市| 昌江| 南宁市| 石林| 卢氏县| 桑日县| 商都县| 满洲里市| 噶尔县| 马边| 手机| 特克斯县| 通辽市| 大兴区| 宁化县| 安泽县| 扶绥县| 招远市| 巴林左旗| 南投市| 邯郸县| 峨眉山市| 荆门市| 乌兰察布市| 寻乌县| 福贡县| 揭阳市| 锦屏县| 新民市| 铁岭县| 聊城市| 都昌县|