【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%。
相关推荐
Mh5 小时前
别再只会 `find` 了:Map 在前端业务里的真实用法
前端·javascript
陈随易5 小时前
FFmpeg 9.0 发布,代号 Lei,音视频处理再升级
前端·后端·程序员
爱丶狸6 小时前
Grafana_Zabbix_ImageRenderer_部署与前端操作手册
linux·前端·zabbix·grafana·kylin
用户059540174469 小时前
把AI对话记忆存储测试从手工改成Playwright+pytest,覆盖率从20%提到96%,回归时间缩短90%
前端·css
kyriewen9 小时前
别再这样写TypeScript了——Code Review中最常见的8个反模式
前端·javascript·typescript
名字还没想好☜9 小时前
Next.js ‘use client‘ 到底加在哪:Server/Client Components 边界与常见报错
开发语言·前端·javascript·react·next.js
午安~婉9 小时前
GitHub Token/ GitHub Stats统计显示图异常
前端·github·vercel·github token
码云之上10 小时前
AI Agent 工程化总览篇:从 Prompt 到 Harness
前端·人工智能
2501_9269783310 小时前
以说明书 DNA 为模板——完整 AGI 的结构图景
前端·人工智能·经验分享·笔记·ai写作
IT_陈寒10 小时前
Vite静态资源引用这个坑我踩得有点疼
前端·人工智能·后端