美文网首页
px和em和rem的区别

px和em和rem的区别

作者: lihaiting | 来源:发表于2019-04-25 15:29 被阅读0次

PX特点

1. IE无法调整那些使用px作为单位的字体大小;

2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;

3. Firefox能够调整px和em,rem,但是有大部分的国产浏览器使用IE内核。

EM特点

-1. em的值并不是固定的;

-2. em会继承父级元素的字体大小。

em则是基于基数(比如:1.5em)来计算出来的相对字体大小。这个基数是需要乘以当前对象从其父级遗传字体大小

 如果你的默认父级容器字体为16px ,那么2em=2*16px

        <div    style="font-size:16px">

               <p    style="font-size:2em"></p>

         </div>

rem特点

rem默认字体大小是依据你网站当前访问时所使用的浏览器或者其他设备来决定的,特别适合响应设计,受到了移动设计的追捧

大多数浏览器(不包括ie8以下)都支持rem单位的字体大小 

如果想支持可以,如下:

html{font-size:62.5%;}

p{font-size:15px;font-size:1.5rem;}

rem为元素设定字体大小时,仍然是相对大小,但相对的HTML根元素


相关文章

  • 前端布局常用方式/库

    一、px、em、rem区别和使用。 https://www.runoob.com/w3cnote/px-em-re...

  • rem,px,em单位区别

    rem,px,em单位区别

  • 前端面试题

    1.请简述px,rem和em有什么区别? px是绝对尺寸单位,其值是固定的。而em和rem是字体相对尺寸单位,其值...

  • px和em和rem的区别

    PX特点 1. IE无法调整那些使用px作为单位的字体大小; 2. 国外的大部分网站能够调整的原因在于其使用了em...

  • px、em和rem的区别

    px:像素。是一个确定的长度单位,设置字体大小为20px,则表示字体大小为固定的值。 em和rem都是相对单位,e...

  • 2020-01-05

    彻底弄懂css中单位px和em,rem的区别 https://www.cnblogs.com/leejersey/...

  • rem与em区别

    响应式Web设计—px-em-rem三者区别及rem的使用在css中单位长度用的最多的是px、em、rem,这三个...

  • 2019-08-29

    px、rem、em的区别 随着css学习的不断深入页面也随之丰富,那么em、rem、px是我们在页面布局中经常会用...

  • 动态 REM——手机专用自适应方案

    什么是 REM REM 是一个相对长度单位,根元素 的字体大小 REM 和 EM 的区别是什么 px 像素 e...

  • em和rem

    css中单位长度用的最多的就是px,em,rem。其中,px是固定像素。em和rem是相对长度单位,em相对于父元...

网友评论

      本文标题:px和em和rem的区别

      本文链接:https://www.haomeiwen.com/subject/colzgqtx.html