【CSS:长度】绝对长度单位 与 相对长度单位

绝对长度单位------它们与其他任何东西都没有关系,通常被认为总是相同的大小。

单位 名称 等价换算
cm 厘米 1cm = 37.8px = 25.2/64in
mm 毫米 1mm = 1/10th of 1cm
Q 四分之一毫米 1Q = 1/40th of 1cm
in 英寸 1in = 2.54cm = 96px
pc 派卡 1pc = 1/6th of 1in
pt 点 1pt = 1/72th of 1in
px 像素 1px = 1/96th of 1in

这些值中的大多数在用于打印时比用于屏幕输出时更有用。例如,我们通常不会在屏幕上使用 cm(厘米)。惟一一个你经常使用的值,就是 px(像素)。


相对长度单位相对于其他一些东西,比如父元素的字体大小,或者视图端口的大小。使用相对单位的好处是,经过一些仔细的规划,你可以使文本或其他元素的大小与页面上的其他内容相对应。下表列出了 web 开发中一些最有用的单位。

单位 相对于
em 在 font-size 中使用是相对于自己元素或父元素的字体大小,在其他属性中使用是相对于自身的字体大小,如 width。
rem 根元素的字体大小。
vw 视口宽度的 1%。
vh 视口高度的 1%。
vmin 视口较小尺寸的 1%。
vmax 视口大尺寸的 1%。
相关推荐
夏幻灵5 分钟前
Express 静态资源托管详解:从本地 HTML 到 express.static()
前端·html·express
yyuuuzz29 分钟前
云服务器部署 web 项目的进程常驻记录
运维·服务器·前端·阿里云·云计算·aws
IT_陈寒32 分钟前
一文搞懂React的核心概念
前端·人工智能·后端
薛一半1 小时前
Redux实战:组件状态管理全解析
开发语言·前端·javascript·react.js
风骏时光牛马1 小时前
功能模块性能测试用例验证
前端
对空六课2 小时前
两个统计平台数据不同:用同一时间窗和事件样本做差异定位
大数据·前端·网络·数据库
lpfasd12310 小时前
node-sass 停止维护!老项目迁移 Dart Sass 完整教程
前端·rust·sass
Data analyse45612 小时前
rnweb 回放数据量太大怎么办?分片存储与断点续传的实现思路
前端·网络·算法·数据分析
xiaogai_gai13 小时前
金蝶收料通知单查询策略实战教程:从源系统拉取到中间层落地的完整路径
java·前端·数据库
环境栈笔记13 小时前
指纹浏览器 WebRTC 怎么设置?从 ICE 候选、代理出口到功能验证
前端·人工智能·后端·自动化