• px像素(Pixel,像素px是相对于显示器屏幕分辨率而言的。
  • em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于父级元素字体尺寸(若父级元素未指定font-size,则一层一层的往上找;若找不到,则相对于浏览器的默认字体尺寸)。
    对应的html代码   <div><p></p></div>
    若设置样式 div{font-size:16px;} p{font-size:1em},那么p元素的font-size为16px。
  • rem是CSS3新增的一个相对单位(root em),根em。 使用rem为元素设定字体大小时,仍然是相对大小,但相对的只是HTML根元素。

    可以设置html,body{font-size=62.5%},那么1rem=10px,方便使用。

  • %百分比,是相对于父元素的比列。

    我们在设置width的时候,经常会用到%。如{width:90%;margin:0 auto} 

css 单位-px、em、rem、百分比的更多相关文章

  1. css单位px,em,rem区别

    在css中单位长度用的最多的是px.em.rem,这三个的区别是: px是固定的像素,一旦设置了就无法因为适应页面大小而改变. em和rem相对于px更具有灵活性,他们是相对长度单位,意思是长度不是定 ...

  2. css 单位 px em rem

    http://www.cnblogs.com/leejersey/p/3662612.html

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

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

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

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

  5. 详细讲解css单位px,em和rem的含义以及它们之间的区别

    一.首先介绍一下px px就是css中最基本的长度单位了,用px做单位基本上没什么问题,可以做到让页面按套路精确的展现! 可但是!但可是!如果全篇用px布局会暗藏一个蛋疼的问题,就是当用户和Ctrl滚 ...

  6. css里px em rem特点(转)

    1.px特点: 1.IE无法调整px作为单位的字体大小: 2.Firefox能够调整px.em和rem. px是像素,是相对长度单位,是相对于显示器屏幕分辨率而言的. 2.em特点: 1.em的值并不 ...

  7. CSS尺寸单位 % px em rem 详解

    在CSS中,尺寸单位分为两类:相对长度单位和绝对长度单位.相对长度单位按照不同的参考元素,又可以分为字体相对单位和视窗相对单位.字体相对单位有:em.ex.ch.rem:视窗相对单位有:vw.vh.v ...

  8. 搞清css的单位 px,em,rem的区别

    前言:现在上大街一眼望去,基本上90%的人都拿着手机,走路,逛街,吃东西都不停着,所以对于我们这种前端开发的程序猿来说,让网页适应于移动端可以说是必须要满足的.所以最近也是一直在学习和实践.然后就接触 ...

  9. Css单位px,rem,em,vw,vh的区别

    px px就是pixel像素的缩写,相对长度单位,网页设计常用的基本单位.像素px是相对于显示器屏幕分辨率而言的 em em是相对长度单位.相对于当前对象内文本的字体尺寸(参考物是父元素的font-s ...

  10. css中px em rem vw vh vmax vmin等单位的区别--转载

    px:绝对单位,页面按精确像素展示 em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值. rem:相对 ...

随机推荐

  1. ObjectID和Handle

    一个dwg对应一个arx database,也就是一套9个符号表和一个有名词典. 一个CAD session中是可以加载多个database的.加载后每个对象都有一个handle和一个objectid ...

  2. gauss消元

    题意描述:有n个星球,m台望远镜.每台望远镜有一个开始时间和结束时间,但只给出了月.日的信息,没有给出年份,每台望远镜记录了它所观测的星球上发生的各类事件的次数.每类事件持续的时间是恒定的,且不会超过 ...

  3. 【freemaker】之include,import区别

    新建三个模版文件 inc1.ftl,inc2.ftl,03.ftml <#--inc1--> <#assign username="老李1"> <#- ...

  4. MyBatis jdbcType常用类型

    MyBatis jdbcType常用类型 jdbcType与javaType对应关系 javaType jdbctype CHAR String VARCHAR String LONGVARCHAR ...

  5. python中获取当前所有的logger

    获得当前所有logger的列表的程序如下: import logging for name in logging.Logger.manager.loggerDict.keys(): logger = ...

  6. Android开发艺术探索读书笔记——01 Activity的生命周期

    http://www.cnblogs.com/csonezp/p/5121142.html 新买了一本书,<Android开发艺术探索>.这本书算是一本进阶书籍,适合有一定安卓开发基础,做 ...

  7. 【学】CSS3的3D动画 ——3D旋转之骰子样式的钟表(2)上

    这个是3D旋转的进阶版,是一个类似与骰子的正方体.这个版本只有秒数的个位数,还没有写整个钟表,下面那个版本好好想想该怎么写 这个效果需要用到transform-style: preserve-3d. ...

  8. metaspace之三--Metaspace解密

    概述 metaspace,顾名思义,元数据空间,专门用来存元数据的,它是jdk8里特有的数据结构用来替代perm,这块空间很有自己的特点,前段时间公司这块的问题太多了,主要是因为升级了中间件所致,看到 ...

  9. JS-改变页面的颜色(二)

    需求:点击页面的按钮,改变页面的颜色 思路:一先画出最简单的页面,二想办法获取页面的body节点,三想办法修改body节点的背景颜色属性,四通过一个方法获取随机的颜色值           和第一个例 ...

  10. Android test---monkey

    一.在使用monkey之前,需要用到模拟器,那么怎么启动模拟器呢,先看一下电脑有什么模拟器,通过命令行查看一下 android list avd 二.看到了模拟器列表了,下来就是启动模拟器了.在命令行 ...