字型可以設定大小使用css font-size來實現,有時需要對字型大小根據瀏覽器解析度來判斷後自適應大小。
在css 2.0中字型大小自適應是難實現的,一般使用js來實現,這裡就不必說了。
現在字型大小自適應樣式常常使用在ie10、谷歌瀏覽器、較新手機、平板平台上(安卓、ios),可以使用css3.0來實現。但是依然是使用font-size字型大小樣式來設定,只不過值在css3版本中新增了自適應百分比大小值。
css3提供了一些與當前viewpoint相關的元素,vw,vh,vim等。
「viewpoint」 = window size
15vw = 15% 設定width(可以理解為寬度單位)
15vh = 15% 設定height(可以理解高度單位)
此css 3單位相容性:chrome 20+/ safari 6+/ ie 10+ / ff 19+ / ios 6+
<
!doctype
html
>
"utf-8"
>
文字大小自適應例項<
/title>
#fontset
<
/style>
<
/head>
"fontset"
>
文字字型大小為5vw
<
/div>
<
/body>
<
/html>
字型大小自適應純css解決方案
css3提供了一些與當前viewpoint相關的元素,vw,vh,vim等。viewpoint window sizevw 1 of viewport width 1vh 1 of viewport height 1vmin 1vw or 1vh,最小 1vmax 1vw or 1vh,最大 例如 ...
字型大小自適應純css解決方案
css3提供了一些與當前viewpoint相關的元素,vw,vh,vim等。viewpoint window sizevw 1 of viewport width 1vh 1 of viewport height 1vmin 1vw or 1vh,最小 1vmax 1vw or 1vh,最大 相容性...
字型大小自適應純css解決方案
css3提供了一些與當前viewpoint相關的元素,vw,vh,vim等。viewpoint window sizevw 1 of viewport width 1vh 1 of viewport height 1vmin 1vw or 1vh,最小 1vmax 1vw or 1vh,最大 相容性...