在国内网站中,包括三大门户,以及“引领”中国网站设计潮流的蓝色理想,ChinaUI等都是使用了px作为字体单位。只有百度好歹做了个可调的表率。而 在大洋彼岸,几乎所有的主流站点都使用em作为字体单位,也就是可调的。没错,px比em更加容易使用,大部分读者不知道em为何物或者它相当于多少 px。国外人士如此重视网站易用性(Accessibility),不仅因为其根生蒂固的人文精神,直接原因可能是因 为有一部法律来约束他们—例如美国的Section 508,强制网站达到一定的易用性。

关键点  1. IE无法调整那些使用px作为单位的字体大小;
  2. 国外的大部分网站能够调整的原因在于其使用了em作为字体单位;
  3. Firefox能够调整px和em,但是96%以上的中国网民使用IE浏览器(或内核)。
  px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。
  em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。
  任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合:
1em=16px。那么12px=0.75em,10px=0.625em。为了简化font-size的换算,需要在css中的body选择器中声明
Font-size=62.5%,这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em,
也就是说只需要将你的原来的px数值除以10,然后换上em作为单位就行了。
  em有如下特点:
  1. em的值并不是固定的;
  2. em会继承父级元素的字体大小。
  所以我们在写CSS的时候,需要注意两点:
  1. body选择器中声明Font-size=62.5%;
  2. 将你的原来的px数值除以10,然后换上em作为单位;
  3. 重新计算那些被放大的字体的em数值。避免字体大小的重复声明。
  也就是避免1.2 * 1.2= 1.44的现象。比如说你在#content中声明了字体大小为1.2em,那么在声明p的字体大小时就只能是1em,而不是1.2em, 因为此em非彼em,它因继承#content的字体高而变为了1em=12px。

  但是12px汉字例外,就是由以上方法得到的12px(1.2em)大小的汉字在IE中并不等于直接用12px定义的字体大小,而是稍大一点。这个问

Jorux已经解决,只需在body选择器中把62.5%换成63%就能正常显示了。原因可能是IE处理汉字时,对于浮点的取值精确度有限。不知道有没有
其他的解释。

最新文章

  1. [LeetCode] Linked List Cycle II 单链表中的环之二
  2. 【Java心得总结七】Java容器下——Map
  3. winform采集网站美女图片程序---多线程篇
  4. 3个sprint的团队贡献分
  5. BFS(染色) LA 3977 Summits
  6. C#结合LumiSoft.Net.dll读取Outlook邮件(.eml格式邮件)
  7. pbfunc外部函数扩展应用-在Powerbuilder中进行Http的GET、POST操作
  8. ${pageContext.request.contextPath} JSP取得绝对路径
  9. C#中的ICollection接口
  10. 未能加载文件或程序集“Report.Basic”或它的某一个依赖项。试图加载格式不正确的程序
  11. MongoDB数据库文档操作
  12. VS工程中的Windows.h
  13. border-radius 圆角
  14. sql字符串根据日期产生日期+自增长标志
  15. ASP.NET MVC Display Mode 移动端视图 配置对微信内置浏览器的识别
  16. 如何弄清Linux系统运行何种系统管理程序
  17. 搜狐JS查ip
  18. 关于web项目创建后WEB-INF下面没有出现web.xml的解决方法
  19. IT编年史 技术生命周期起步,成长,成熟和衰退四个阶段 IT历史总结
  20. Xcode密钥没有备份或者证书过期,出现Valid Signing错误

热门文章

  1. JAVA-蓝桥杯-算法训练-字符串变换
  2. Java 第十一届 蓝桥杯 省模拟赛十六进制转换成十进制
  3. Java实现 蓝桥杯VIP 算法训练 求完数
  4. Java实现Fibonacci取余
  5. Java实现 LeetCode 133 克隆图
  6. Java实现 蓝桥杯VIP 算法提高 传染病控制
  7. Java实现 LeetCode 42 接雨水
  8. java算法集训代码填空题练习1
  9. 点击 button 自动刷新页面
  10. 【asp.net core】7 实战之 数据访问层定义