px&em&rem

1.em&px的区别,不是很重要Ie6-8有问题,国内大多用em

1.em的值并不是固定的,是根据当前字体的大小而定,1em就是当前字体的大小。而px的大小是固定。
2.em可以继承自父容器,而px不行。
3.在IE中px的字体是不能够改变大小的(在IE上方点击 查看 > 文字大小)。缩放都可以的

Paste_Image.png

单纯使用em也不行,在ie中仍然存在问题,或大或小
可以结合百分比:
body{ font-size:100%;}
h1{ font-size:3.75em;}
h2{ font-size:2.5em;}
p{ font-size:0.875em;}
正常设置

 1.body选择器中声明Font-size=62.5%;
 2.将你的原来的px数值除以10,然后换上em作为单位;

2.rem 很重要

这个单位可谓集相对大小和绝对大小的优点于一身,通过它既可以做到只修改根元素就成比例地调整所有字体大小,又可以避免字体大小逐层复合的连锁反应。
Mozilla Firefox 3.6+Apple Safari 5+Google ChromeIE9+Opera11+。支持
em”是相对于其父元素来设置字体大小的,这样就会存在一个问题,进行任何元素设置,都有可能需要知道他父元素的大小,在我们多次使用时,就会带来无法预知的错误风险。而rem是相对于根元素<html>,这样就意味着,我们只需要在根元素确定一个参考值,在根元素中设置多大的字体,这完全可以根据您自己的需

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

//下面是如何编写手机端web
http://www.jianshu.com/p/b00cd3506782
http://www.jianshu.com/p/e848fcc7e205
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,841评论 1 92
  • ·##概念介绍:1.px(pixel,像素):是一个虚拟长度单位,是计算机系统的数字化长度单位,如果px要换算成物...
    小时候很帅的龙少阅读 2,157评论 0 6
  • IE无法调整那些使用px作为单位的字体大小; 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;...
    6659a0f02826阅读 353评论 0 0
  • 直奔主题! 一,px ---- 像素(Pixel)。 相对长度单位。 像素px是相对于显示器屏幕分辨率而言的,作为...
    远眺北极熊阅读 1,512评论 0 0
  • PX特点 IE无法调整那些使用px作为单位的字体大小; 国外的大部分网站能够调整的原因在于其使用了em或rem作为...
    httIsHere阅读 259评论 0 0