CSS3中的px,em,rem,vh,vw辨析
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辨析的更多相关文章
- css3中单位px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况
原文地址: http://blog.csdn.net/jyy_12/article/details/42557241 px:绝对单位,页面按精确像素展示 em:相对单位,基准点为父节点字体的大小,如果 ...
- CSS3中的px,em,rem,vh,vw
1.px:像素,精确显示 2.em:继承父类字体的大小,相当于“倍”,如:浏览器默认字体大小为16px=1em,始终按照div继承来的字体大小显示,进场用于移动端 em换算工具:http://www. ...
- 尺寸单位em,rem,vh,vw
这几天做demo,看了网上教程有用到尺寸单位vh,vw, 这些单位不是很熟悉,所以上网上找了些资料来认识了这些不认识的单位 1.em 在做手机端的时候经常会用到的做字体的尺寸单位 说白了 em就相当于 ...
- 理解并使用CSS3中的单位rem vh vw vmin vmax
rem vh vw vmin vmax做为CSS3中的新单位,其实都出来挺久的了,这篇文章将总结并理解下它们. rem 如果你给body设置了font-size字体大小,那么body的任何子元素的1e ...
- css中px,em,rem,rpx的区别
今天看到一个面试题为 px,em的区别,为了更好地让读者区分css的长度单位,我总结下css中常用的长度单位: px,em,rem,rpx 像素px是我们在定义CSS中经常用到的尺寸大小单位,而em在 ...
- css大小单位px em rem的转换和详解
css大小单位px em rem的转换和详解 PX特点1. IE无法调整那些使用px作为单位的字体大小:2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位:3. Firefox能 ...
- px,em,rem的区别
PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位: 3. Firefox能够调整px和em,rem,但是96%以上 ...
- px em rem 区别
PX:PX实际上就是像素,用PX设置字体大小时,比较稳定和精确.但是这种方法存在一个问题,当用户在浏览器中浏览我们制作的Web页面时,如果改变了浏览器的缩放,这时会使用我们的Web页面布局被打破.这样 ...
- px,em,rem字体单位
1.px像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的.(引自CSS2.0手册) 2.em是相对长度单位.相对于当前对象内文本的字体尺寸,em存在值继承问题. 浏览器的默认字 ...
随机推荐
- 点击div 跳转并通过URL传参
点击div前要先给div绑定要传的参数: //给panel绑定自定义属性,方便在跳转时传带参数,键/值对排列 panel.attr("user_age",user_age); pa ...
- css 使图片水平垂直居中
1.利用display:table-cell,具体代码如下: html代码如下: <div class="img_wrap"> <img src="wg ...
- bzoj 1500 维修数列
splay乱搞. 调了两个多小时...这辈子再也不想写splay了... 维护左边最大连续和右边最大连续,维护两个标记,无脑push_down.push_up就行了. 注意最大连续和至少要包含一个数. ...
- Python 【第十章】 Django路由
路由可以简单理解就是 URL -> 函数名 例如: /login1/ -> 函数名 urls.py文件中 urlpatterns = [ # url(r'^admin/', admin.s ...
- Javascript中两个等于号和三个等于号的区别(==/===)
==//表示值的比较 ===//表示对象类型的比较 1.对于string,number等基础类型,==和===是有区别的. a)不同类型间比较,==之比较“转化成同一类型后的值”看“值”是否相等,== ...
- supervisor的使用:
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "Helvetica Neue"; color: #e4af0a } sp ...
- JMeter 问题
1. JMeter 测试计划 测试计划 使用 JMeter 进行测试的起点,是其它 JMeter 测试元件的容器. 线程组 代表一定数量的并发用户,它可以用来模拟并发用户发送请求.实际的请求内容在S ...
- 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 ...
- Swift-UIButton
// let bt = UIButton(frame:CGRectMake(10,20,50,50)) let button = UIButton(frame:CGRectMake(10, 150, ...
- Eclipse启动Tomcat时server.xml和content.xml自动还原问题
当我们在处理中文乱码或是配置数据源时,我们要修改Tomcat下的server.xml和content.xml文件. 但是当我们修改完后重启Tomcat服务器时发现xml文件又被还原了,修改无效果. 为 ...