rem 和 em 的区别

已于 2022-04-28 15:17:48 修改
阅读量3.9k 收藏 11
点赞数
分类专栏： css 文章标签： css
于 2022-04-28 15:16:16 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yf18040578780/article/details/124474700
版权

em和em都是相对单位，主要参考的标签不同：

  1. rem是相对于根字号，即相对于<html>标签的font-size实现的，浏览器默认字号是font-size:16px
  2. em:是相对于父元素标签的字号，和百分比%类似，%也是相对于父级的，只不过是%相对于父级宽度的，而em相对于父级字号的

                vw和vh

  1. vw和vh分别相对于屏幕宽度和屏幕高度的，1vw相当于屏幕宽度的1%,100vw相当于满屏宽度100%,
  2. vh和vh类似，只不过是相对于屏幕高度的，1vh相当于屏幕高度的1%,100vh相当于满屏高度的100%,
前端小芬芬
关注
专栏目录
前端常用单位：em和rem简单介绍
qq_34838046的博客
09-12 3432
em（容易出错） 相对于父级元素的font-size计算而来 本级元素字体大小（单位为px）=父级元素的字体大小（转化为px） * 本级元素em的值 例如： 父级元素：20px， 子级元素的1em相当于20px 若父级元素的单位也是em，则一层层往上找，直到找到单位为px的元素。 例如： 父级元素的font-size为0.8em，父级元素的上一级元素的font-size为20px 则父级元素的font-size为0.8*20=16px。 则子级元素的1em相当于16px 因为这个特性，多级嵌套的元素若是
rem、em、px的区别
m0_66783294的博客
05-13 2212
rem、em、px的区别 1.px像素（pixel）。绝对单位。像素px是相对于显示器屏幕分辨率而言的，是一个虚拟长度单位，是计算机系统的数字化图像长度单位 2.em是相对长度单位，相对于当前对象内文本的字体尺寸。如果当前行内文本的字体尺寸未被人为设置。则相对于浏览器的默认字体尺寸，它会继承父级元素的字体大小，因此并不是一个固定的值 3.rem是css3新增的一个相对单位（root em，根em'），使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素 4.区别： IE无法调
rem和em的区别
热门推荐
前进者
07-01 2万+
文章里面的代码可以直接复制，运行！
前端中rem和em的区别，分别如何使用
最新发布
admire_fish的博客
07-28 335
前端中rem和em的区别，分别如何使用
em和rem的区别
SiReSo的博客
03-14 2万+
1. em 是一个相对单位。相对于当前对象内文本的font-size，如果当前文本的字体尺寸没有设置，则相对于浏览器的默认字体尺寸。即1em=16px 特点： em的值并不是固定的 em会继承父元素的字体大小 2. rem 是一个相对单位。是相对HTML根元素。 特点： rem为元素设定字体大小的时候，是相对于根元素进行计算的。 当我们改变根元素下的字体大小时，下面的大小都会改变。 ...
rem与em的使用及区别
JCONETWO的博客
04-07 1010
em与rem的区别，及使用。
浅析rem和em和px vh vw和% 移动端长度单位
12-13
本文主要探讨了rem、em、px、vh、vw以及%这几种常见的长度单位，分析它们的特点与应用场景。 1. **px（像素）** - 像素是绝对单位，表示屏幕上的一个物理点。1px始终等于1个物理点，不会因设备或浏览器设置而改变...
css中px、em和rem的区别总结
01-21
em 和 rem 区别 区别是浏览器根据谁来转化成 px 值 rem 单位如何转化为像素值 当使用 rem 单位，他们转化为像素大小取决于页根元素的字体大小，即 html 元素的字体大小。 根元素字体大小乘以你 rem 值
CSS 中px、em、rem、%、vw、vh单位之间的区别详解
11-21
本文将详细解析px、em、rem、%、vw和vh这些单位的区别及其应用场景。 1. **px (像素)**: 像素是绝对长度单位，它基于屏幕的物理分辨率。1px表示设备上的一点，通常用于创建精确的图形或保持元素大小恒定。由于px是...
em与rem的区别
seimeii的博客
07-18 251
em与rem的区别
rem和em的区别你知道么？
2302_76765965的博客
08-06 380
我定义了三个盒子，一个父亲盒子parent以及两个子盒子child1和child2，并且父盒子字体大小为20px，宽高为10em，child1的盒子宽高为2em，child2盒子的宽高为2rem。child2子盒子宽高是以rem为单位的，虽然是parent的子盒子，但因为rem是以根因素的字体大小进行计算的，并且根元素的字体大小我设置的是10px，所以child2的宽高为2乘10px为20px。总结：rem是相对于根元素的字体大小计算，而em是相对于父元素的字体大小计算。-- .child2盒子的宽高。
rem em的区别 基于什么
06-08
`rem` 和 `em` 都是相对长度单位，但它们的基准不同。...综上所述，`rem` 和 `em` 的区别在于它们的基准不同，一个是根元素，一个是父元素。在实际开发中，应根据具体情况选择合适的相对长度单位。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值