• 主页

  • 投资

  • IT

    🔥

  • 设计

  • 销售

  • 人

  • 共38篇

    前端 - CSS

关闭

返回栏目

关闭

返回前端 - CSS栏目

5 - 单位 - 单位 - px、%、em、rem、vw、vh、 vmin、vmax

作者：

贺及楼

成为作者

更新日期：2024-06-07 17:20:15

绝对长度

绝对长度单位是一个固定的值，它反应一个真实的物理尺寸。绝对长度单位视输出介质而定，不依赖于环境（显示器、分辨率、操作系统等）。

分类 单位 英文名 中文名 释义
绝对长度 in Inch 英寸
绝对长度 cm Centimeter 厘米
绝对长度 mm Millimeter 毫米
绝对长度 q 1/4毫米
绝对长度 pt point 镑 72分之一英寸，pt=1/72(英寸)
绝对长度 pc Pica 派卡 大约6pt，1/6寸
绝对长度 px Pixel 像素 与屏幕相关

换算比例：1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
chrome浏览器强制最小字体为12px，10px也会显示12px

相对长度

分类 单位 英文名 中文名 释义
相对长度 % 相对于父元素的尺寸的%
相对长度 em 倍 父元素的font-size,浏览器默认16px。1em = 16px, 2em = 32px 可以指定到小数点后三位，比如“1.234em”
相对长度 rem root倍 root根元素（<html>/浏览器默认）
相对长度 vw viewport units 可视窗口单位 1vw等于视口宽度的1%
相对长度 vh viewport units 可视窗口单位 1vh等于视口高度的1%
相对长度 vmin
相对长度 vmax
相对长度 vm
相对长度 ch
相对长度 ex

都不行，width/height就auto值+配置padding