前端测试题:关于WEB中常用的度量单位，表述错误的是？
考核内容:web在不同设备下的度量使用
题发散度: ★★
试题难度: ★★
解题思路:
在做上面的题目时要注意
1rem、1em、1vh、1px各自代表的含义？
- rem是全部的长度都相对于根元素<html>元素。通常做法是给html元素设置一个字体大小，然后其他元素的长度单位就为rem。
- em 子元素字体大小的em是相对于父元素字体大小
元素的width/height/padding/margin用em的话是相对于该元素的font-size
<div> boxoutside 0 </div>
<div class="box">
<div class="box1">box 1</div>
<div class="box2">box 2</div>
<div class="box3">box 3</div>
</div>
<style>
html{font-size: 50px}
.box{font-size: 12px}
.box1{font-size: 1em}
.box2{font-size: 2em}
.box3{font-size: 3em}
</style>
- vw/vh
全称是 Viewport Width 和 Viewport Height，视窗的宽度和高度，相当于 屏幕宽度和高度的 1%，不过，处理宽度的时候%单位更合适，处理高度的 话 vh 单位更好。
<div class="box">
<img src="pic.jpg" alt="100*80">
<img src="pic.jpg" class="s1" alt="100*80">
<img src="pic.jpg" class="s2" alt="100*80">
<img src="pic.jpg" class="s3" alt="100*80">
</div>
<style>
*{margin: 0;padding: 0}
.box{width: 300px;height: 300px;background: pink}
.s1{height: 10vw}
.s2{width: 10vh}
.s3{width: 60vw;height: 50vh}
</style>
要注意的是
rpx单位是微信小程序中css的尺寸单位，
rpx可以根据屏幕宽度进行自适应。
答案：
B. em子元素字体大小的em是相对于根元素HTML字体大小本文参与 腾讯云自媒体同步曝光计划，分享自微信公众号。
原始发表：2020-05-15，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
腾讯云开发者
