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. 点击div 跳转并通过URL传参

    点击div前要先给div绑定要传的参数: //给panel绑定自定义属性,方便在跳转时传带参数,键/值对排列 panel.attr("user_age",user_age); pa ...

  2. css 使图片水平垂直居中

    1.利用display:table-cell,具体代码如下: html代码如下: <div class="img_wrap"> <img src="wg ...

  3. bzoj 1500 维修数列

    splay乱搞. 调了两个多小时...这辈子再也不想写splay了... 维护左边最大连续和右边最大连续,维护两个标记,无脑push_down.push_up就行了. 注意最大连续和至少要包含一个数. ...

  4. Python 【第十章】 Django路由

    路由可以简单理解就是 URL -> 函数名 例如: /login1/ -> 函数名 urls.py文件中 urlpatterns = [ # url(r'^admin/', admin.s ...

  5. Javascript中两个等于号和三个等于号的区别(==/===)

    ==//表示值的比较 ===//表示对象类型的比较 1.对于string,number等基础类型,==和===是有区别的. a)不同类型间比较,==之比较“转化成同一类型后的值”看“值”是否相等,== ...

  6. supervisor的使用:

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Helvetica Neue"; color: #e4af0a } sp ...

  7. JMeter 问题

    1.  JMeter 测试计划 测试计划 使用 JMeter 进行测试的起点,是其它 JMeter 测试元件的容器. 线程组 代表一定数量的并发用户,它可以用来模拟并发用户发送请求.实际的请求内容在S ...

  8. entrar en su zapatilla de deporte en este lugar

    Mientras que yo apareció su campo usando nuestro Nike Glide Wildhorse sólo dos ($ 110) zapatillas de ...

  9. Swift-UIButton

    // let bt = UIButton(frame:CGRectMake(10,20,50,50)) let button = UIButton(frame:CGRectMake(10, 150, ...

  10. Eclipse启动Tomcat时server.xml和content.xml自动还原问题

    当我们在处理中文乱码或是配置数据源时,我们要修改Tomcat下的server.xml和content.xml文件. 但是当我们修改完后重启Tomcat服务器时发现xml文件又被还原了,修改无效果. 为 ...