-
CSS常用的长度单位
px
px 是绝对单位，也是 web 前端最为常见的单位，px表示像素，它的值不会受其他元素或其他值的影响。%
% 是相对单位，将元素的单位设置为百分比的形式后，浏览器将会根据其父元素的样式来计算该值。这样使用的好处是，当父元素的大小发生变化时，子元素也会按照比例发生改变。
rem
rem 是相对单位，相对于根(html)元素的字体大小。比如根元素字体大小为16px（16px也是浏览器默认的字体大小），那么如果有一个元素的fontsize为2rem，则该2rem相当于是32px。rem不受其他因素的影响，与 em 不同的是，它没有嵌套的效应。因此，rem常被当做“相对布局”的单位首选，尤其在移动端。
rem 应用于响应式布局，常常会结合媒体查询
@media使用。em
em 是相对单位。在
font-size中使用是相对于父元素的字体大小，而在其他属性中使用是相对于自身的字体大小，如 width。可以通过下面这个例子理解：
DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Titletitle> head> <body> <div style="font-size: 15px"> hello Word ！ <p style="font-size: 2em;width: 2em;">em是相对长度单位p> div> body> html> p元素的fontsize和width都是2em，但表示的意义不同。 fontsize的2em，是相对于父元素 fontsize：15px的2倍，即 30px。 而 width 的2em，是自身fontsize：2em的2倍，即 60px。- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
vw 和 vh
vw 和 vh 都是相对于视口，即设备屏幕可视区域。取值范围都是 [0,100]
1vw 表示可视区域的
宽度的 1%。100vw即表示可视区域的全部宽度。1vh 表示可视区域的
高度的 1%。100vh即表示可视区域的全部高度。关于长度 0
如果长度为0，则不需要单位标识符。
否则，单位标识符都是必须的，不区分大小写，并且必须紧跟在值的数字部分之后，中间没有空格。
-
相关阅读:
ABAP SLG1/SLG0 应用日志 自己封装类 记录
一网打尽Mac上的软件套装 - Omi特别篇（附演示视频）
demo(一)eureka----服务注册与提供
pip install torch
c# Dictionary、ConcurrentDictionary的使用
zk常用命令ls、ls2、get、stat，参数意思（重补早期学习记录）
【超详细】手把手教你STM32上报温湿度到腾讯云
kubernetes集群编排（12）
git命令
前端性能优化：网站性能优化
- 原文地址：https://blog.csdn.net/qq_53931766/article/details/127861577
