 |
1
danbai PRO 他说的是 rem 吧
|
 |
2
nazalewoyuanyi OP |
 |
3
rabbbit Sep 3, 2022
font-size: 1em 这个根据谁计算？
width: 1em 这个又根据谁计算？ |
 |
4
stein42 Sep 3, 2022  7
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Values_and_units
em: 在 font-size 中使用是相对于父元素的字体大小，在其他属性中使用是相对于自身的字体大小，如 width |
 |
5
foufoufm Sep 3, 2022
请教一下，主帖中的说的简中是指中文互联网？？
帖子没看懂。 |
 |
6
otakustay Sep 3, 2022
em 当然是根据父元素来的，不然自己 font-size: 2em 不就死循环了
|
|
8
nazalewoyuanyi OP @otakustay
```css .parent { font-size: 10px; .child { font-size: 20px; width: 1em; } } ``` 如果按照你说的，child 的宽度应该是 10px ，实际上最后的宽度是 20px ，你可以自己验证一下。 |
|
9
rabbbit Sep 3, 2022
em 多用于 font-size ，所以多数面试 em 也默认是用在 font-size 上。
以前的移动端适配和大屏倒是会使用 rem 作为计算单位。 我很好奇在什么情况会使用 width: Xem |
|
10
foufoufm Sep 3, 2022
@otakustay 感谢回复，那其实我觉得面试官有点扯了， 国际规则和国标规则不一样很正常，大概明白这里工作是怎么样就好了。没想到前端的面试这么八股。
|
 |
11
Rache1 Sep 3, 2022
font-size 是可继承的 - -，是相对于自身的。
|
 |
12
4263Ad06Awk3b1Do Sep 3, 2022
歪个楼,楼主头像本人?
|
|
13
nazalewoyuanyi OP |
 |
14
h1104350235 Sep 3, 2022
面试官的话并不是全对的。
要有一种求真的 |
 |
15
estk Sep 3, 2022 via Android
这考察的是英文，rem 的 r 是 root 根 的意思
|
|
16
otakustay Sep 3, 2022
@zhaomeicheng #8 打字打漏了，em 在 font-size 的时候自然是父元素的字体大小
|
 |
17
learnshare Sep 3, 2022 3
记住核心：em 是一个倍数，em 应该以 font-size 为基准计算
那么： 1. 元素的 font-size: Xem 只能从父元素获得（继承） 2. 元素的其他属性（ Xem ）以自己的 font-size 计算 --- 另外，em/rem 应当只用于文本相关的属性，不应当用于布局相关的属性 |
 |
18
shanmin Sep 3, 2022 1
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Values_and_units
em: 在 font-size 中使用是相对于父元素的字体大小，在其他属性中使用是相对于自身的字体大小，如 width |
 |
19
DrakeXiang Sep 5, 2022
学习了，我之前也一直以为 em 是永远相对于父元素字体大小的。
不过要说的是，让你们不要看翻译的二手资料，即使是 mdn 的翻译也不准的。。 英文说的是 `Font size of the parent, in the case of *typographical properties like font-size*, and font size of the element itself, in the case of other properties like width.` 到了中文就直接只剩了 font-size ，所谓三人成虎就是这么来的 |
|
20
nazalewoyuanyi OP |
 |
21
coolooks Sep 6, 2022
em 根据上级 font-size 计算，如果上级没有，会根据上上级 font-size 计算，以此类推。
rem 根据根元素 font-size 计算。 |
Select Language