web设计_2_灵活的文字

标签：

最佳设计：可以让用户自由控制任何页面的文字大小。

        浏览器中用户都是可以自定义默认的文字大小的，如果使用 px，用户自行在浏览器设置中改变了文字大小后，网页上是不会变化的。我们不能排除视障用户（如近视）、老年用户不会这么做.

        利用CSS3的rem单位，避免了em相对父元素比例的嵌套问题，为了兼容IE低版本的需要添加px单位.

html {
    font-size: 62.5%;/*10 ÷ 16 × 100% = 62.5%*/
}
body {
    font-size:14px; /*兼容IE*/
    font-size: 1.4rem;/*1.4 × 10px = 14px */
}
h1 {
    font-size:24px; /*兼容IE*/
     font-size: 2.4rem;/*2.4 × 10px = 24px*/
}

既然 rem 的可用性更好，是不是在所有地方都去使用呢？

通常在标题，正文等大面积文字的位置可以使用 rem。

但是在一些特殊的设计场景，rem 可能会导致布局错位，比如这样一个回顶部的按钮：

可以看到”回顶部”三个字通过放大已经改变的样式,这是不希望看到的,这了最好只用px

web设计_2_灵活的文字

标签：

原文地址：http://www.cnblogs.com/Peng2014/p/4644054.html