1、px:像素,精确显示

2、em:继承父类字体的大小,相当于“倍”,如:浏览器默认字体大小为16px=1em,始终按照div继承来的字体大小显示,进场用于移动端

em换算工具:http://www.runoob.com/tags/ref-pxtoemconversion.html

3、rem:与em类似,rem是继承根节点的属性(即<html>标签),其他的与em相同

4、vh:当前可见高度的1%=1vh

区别是:当div中没有内容时,height=100%,则高度不显示出来

当div中没有内容时,height=100vh,则高度依然能显示出来

5、vw:当前可见宽度的1%=1vw

区别是:当div中没有内容时,width=100%,则宽度不显示出来

当div中没有内容时,width=100vh,则宽度依然能显示出来

CSS3中的px,em,rem,vh,vw辨析的更多相关文章

  1. css3中单位px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况

    原文地址: http://blog.csdn.net/jyy_12/article/details/42557241 px:绝对单位,页面按精确像素展示 em:相对单位,基准点为父节点字体的大小,如果 ...

  2. CSS3中的px,em,rem,vh,vw

    1.px:像素,精确显示 2.em:继承父类字体的大小,相当于“倍”,如:浏览器默认字体大小为16px=1em,始终按照div继承来的字体大小显示,进场用于移动端 em换算工具:http://www. ...

  3. 尺寸单位em,rem,vh,vw

    这几天做demo,看了网上教程有用到尺寸单位vh,vw, 这些单位不是很熟悉,所以上网上找了些资料来认识了这些不认识的单位 1.em 在做手机端的时候经常会用到的做字体的尺寸单位 说白了 em就相当于 ...

  4. 理解并使用CSS3中的单位rem vh vw vmin vmax

    rem vh vw vmin vmax做为CSS3中的新单位,其实都出来挺久的了,这篇文章将总结并理解下它们. rem 如果你给body设置了font-size字体大小,那么body的任何子元素的1e ...

  5. css中px,em,rem,rpx的区别

    今天看到一个面试题为 px,em的区别,为了更好地让读者区分css的长度单位,我总结下css中常用的长度单位: px,em,rem,rpx 像素px是我们在定义CSS中经常用到的尺寸大小单位,而em在 ...

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

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

  7. px,em,rem的区别

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

  8. px em rem 区别

    PX:PX实际上就是像素,用PX设置字体大小时,比较稳定和精确.但是这种方法存在一个问题,当用户在浏览器中浏览我们制作的Web页面时,如果改变了浏览器的缩放,这时会使用我们的Web页面布局被打破.这样 ...

  9. px,em,rem字体单位

    1.px像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的.(引自CSS2.0手册) 2.em是相对长度单位.相对于当前对象内文本的字体尺寸,em存在值继承问题. 浏览器的默认字 ...

随机推荐

  1. @RenderSection,@RenderPage,@RenderBody介绍

    在MVC的模板页中会用到上面三个东西,那么今天就简单归纳下各有什么作用 1.@RenderSection 用法 对CSS或JS部分模块的预留定义 例如模板页定义了@RenderSection(&quo ...

  2. hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images

    hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images, 本例子主要是使用HTML5 的File API,建立一個可存取到该file的url, 一个空的img标签,ID为img0,把 ...

  3. html javascript css3 php3.2.3离线手册

    各位新年快乐! 愿大家"愿有前程可奔赴,也有岁月可回头"! 发现个离线手册很全的网站,分享大家,也mark自用. http://www.shouce.ren/ 手册网

  4. Oracle视图时间戳转为Date

    CREATE OR REPLACE VIEW PDAORDER AS SELECT po.id id, po.order_no AS order_no, po.money AS money, (SEL ...

  5. 北京培训记day5

    高级数据结构 一.左偏树&斜堆 orz黄源河论文 合并,插入,删除根节点 打标记 struct Node { int fa,l,r,w,dep } tree[Mx]; int Merge(in ...

  6. Django知识点整理

    什么是web框架 框架,即framework,特指为解决一个开放性问题而设计的具有一定约束性的支撑结构,使用框架可以帮你快速开发特定的系统,简单地说,就是你用别人搭建好的舞台来做表演. web应用 访 ...

  7. 为什么FFT时域补0后,经FFT变换就是频域进行内插?

    应该这样来理解这个问题: 补0后的DFT(FFT是DFT的快速算法),实际上公式并没变,变化的只是频域项(如:补0前FFT计算得到的是m*2*pi/M处的频域值, 而补0后得到的是n*2*pi/N处的 ...

  8. CentOS7清理yum缓存和释放内存方法

    清理yum缓存 清理yum缓存使用yum clean 命令,yum clean 的参数有headers, packages, metadata, dbcache, plugins, expire-ca ...

  9. HDU 5944 Fxx and string(暴力/枚举)

    传送门 Fxx and string Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/65536 K (Java/Othe ...

  10. URL.createObjectURL和URL.revokeObjectURL

    一.URL.createObjectURL URL.createObjectURL()方法会根据传入的参数创建一个指向该参数对象的URL. 这个URL的生命仅存在于它被创建的这个文档里,新的对象URL ...