zoukankan      html  css  js  c++  java
  • 有关px,em,rem的区别

    px,em,rem都是描述屏幕上大小的单位。

    px,是指屏幕上的像素单位,不同尺寸的屏幕上,1px的大小不同。

    em,则是相对而言的单位。现代浏览器默认字体为16px,则1em=16px,那么设置某字体大小为0.8em,则0.8em=16px * 0.8=12.8px;所以em的值并不固定,且em具有继承性,能够继承父元素的大小。例如:

    <div>
        <p></p>
    </div>

    声明div中的字体为0.5em,默认16px情况下div中内容为8px,那么此时P标签的font-size,它的1em=8px,而不再是16px。

    那么问题就来了,在多层嵌套下,em的相对计算就会变得很麻烦。为了解决这样的问题,rem诞生了。

    rem,(root em)从名字可以开出来,说白了还是em,只不过是相对于根元素html的而言的单位。这就没有了em的那些复杂的继承问题。除了老版本的浏览器外,各大浏览器的最新版本基本都已经支持rem了,对于无法支持的旧版浏览器,也只需要多写个px上去就好了,例如:

    p {font-size:16px;font-size:1rem;}
  • 相关阅读:
    vue 2 渲染过程 & 函数调用栈
    vue keep-alive的实现原理和缓存策略
    记 vue 表单的一个性能问题
    IIS 部署到服务器上出现数据库连接失败
    JS apply和call
    js 检查对象是否没有字段
    c# httpclient
    js 使用flow
    IIS 出现405
    站点js屏蔽他人广告
  • 原文地址:https://www.cnblogs.com/Dengxiaobo/p/7880874.html
Copyright © 2011-2022 走看看