em rem 相对单位:  也可用于设置padding line-height等
em相对当前容器的默认字体设置
比如,所有浏览器默认字体都是16px,body{ font-size:62.5%}
以后即1em=10px; 1.2em=12px
在线转换tool: http://pxtoem.com/

em(css2.0) rem(css3.0)

rem相对于页根元素的字体大小,即 html 元素的字体大小
比如:html{font-size:16px;} 10rem=160px;
配合 使用media query 设置html的font-size;

html{font-size:10px}
@media screen and (min-width:321px) and (max-width:375px){html{font-size:11px}}
@media screen and (min-width:376px) and (max-width:414px){html{font-size:12px}}
@media screen and (min-width:415px) and (max-width:639px){html{font-size:15px}}
@media screen and (min-width:640px) and (max-width:719px){html{font-size:20px}}
@media screen and (min-width:720px) and (max-width:749px){html{font-size:22.5px}}
@media screen and (min-width:750px) and (max-width:799px){html{font-size:23.5px}}
@media screen and (min-width:800px){html{font-size:25px}}

em,rem的更多相关文章

  1. 彻底弄懂css中单位px和em,rem的区别

    国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? PX特点 -1. IE无法调整那些使用px作为单位的字体大小: -2. 国外的大部分网站能够调 ...

  2. css大小单位px em rem的转换和详解

    css大小单位px em rem的转换和详解 PX特点1. IE无法调整那些使用px作为单位的字体大小:2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位:3. Firefox能 ...

  3. px,pt,em,rem

    一直对px,pt,em,rem的认识有误区,现整理一下,供参考.之后还得整理下关于dpi相关的知识. px(pixe,像素l):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物 ...

  4. 关于CSS中的字体尺寸设置 em rem等

    常用单位 在CSS中可以用很多不同的方式来设定字体的尺寸.一般来说,这些单位被分成两大类:绝对单位(absolute)和相对单位(relative). 绝对单位在大多数情况下是相对于某些实际量度而言的 ...

  5. 彻底弄懂css中单位px和em,rem的区别 转的自己看

    国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的 ...

  6. px,em,rem的区别

    PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位: 3. Firefox能够调整px和em,rem,但是96%以上 ...

  7. 弄懂css中单位px和em,rem的区别

              国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢?         PX特点 1. IE无法调整那些使用px作为单位的字体大小 ...

  8. 关于响应式、媒体查询和media的关系 、流媒体布局flex 和em rem像素的使用 我有一些废话要讲.....

    一.什么是响应式 随着移动端越来遇火 网站的布局成为一个热议的话题 有的人喜欢用手机浏览网站.有的人喜欢用paid浏览网站.有人喜欢用电脑浏览网站 那么问题来了 我们怎么样才能使用一套css样式 完成 ...

  9. 【转载】彻底弄懂css中单位px和em,rem的区别

    原文链接:http://www.cnblogs.com/leejersey/p/3662612.html 国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什 ...

  10. css中单位px和em,rem的区别[转载]

    PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位: 3. Firefox能够调整px和em,rem,但是96%以上 ...

随机推荐

  1. JavaScript高级程序设计第三版.CHM【带实例】

    从驱动全球商业.贸易及管理领域不计其数的复杂应用程序的角度来看,说 JavaScript 已经成为当今世界上最流行的编程语言一点儿都不为过. JavaScript 是一种非常松散的面向对象语言,也是 ...

  2. Python入门必学:数据类型和变量的用法

    什么是数据类型?计算机顾名思义就是可以做数学计算的机器,因此,计算机程序理所当然地可以处理各种数值.但是,计算机能处理的远不止数值,还可以处理文本.图形.音频.视频.网页等各种各样的数据,不同的数据, ...

  3. 17,saltstack高效运维

      salt介绍 saltstack是由thomas Hatch于2011年创建的一个开源项目,设计初衷是为了实现一个快速的远程执行系统. salt强大吗 系统管理员日常会进行大量的重复性操作,例如安 ...

  4. JsBridge "Uncaught TypeError: Cannot call method 'callHandler' of undefined", source

    h5和原生结合开发app越来越流行.其实就是webview 的js调用native的方法.也就是需要搭建一个桥.这样的桥早就有人搭建好了,那就是jsbridge. git地址: https://git ...

  5. Android自定义组件之简单组合

    Android自定义控件有两种,一种是组合.比如一个linearlayout 里面有textview,imageview. 这样的好处是,写一个就可以多处使用. view_image_and_butt ...

  6. PYTHON -MYSQLDB安装遇到的问题和解决办法

    目前下载的mysqldb在window下没有exe安装包了,只有源码. 使用python setup.py install 命令安装, 报错如下: 异常信息如下: F:\devtools\MySQL- ...

  7. docker部署思路

    1.docker安装2.拉取centos镜像或者Ubuntu镜像 看你用哪个3.使用镜像,run出来一个容器A4.进入容器A,安装uwsgi,把Django部署在下面5.在启动脚本中配置开机自启动脚本 ...

  8. Action参数和View、Json、重定向

    一.Action 1.Action参数: 普通参数.Model类.FormCollection (1).普通参数 Index(string name,int age)   框架会自动把用户请求的Que ...

  9. DataSource的设置

    1.Centos和redhat,Fedora等版本无须设置,直接在cloud.cfg指定,默认是EC2 datasource_list: ['ConfigDrive','OpenStack'] 2.u ...

  10. sources.ustc.debian

    deb http://mirrors.ustc.edu.cn/debian/ jessie main contrib non-free deb-src http://mirrors.ustc.edu. ...