CSS 单位参考

免费在线CSS单位参考,按类别整理px、em、rem、%、vw、vh、vmin、vmax、ch等单位的用途与用法,并说明绝对单位与相对单位的换算关系和常见取值场景。 可在编码时于一处快速查阅代码、符号、快捷键等参考信息,在浏览器中即时搜索和复制,无需注册或安装即可免费使用。 结果可一键复制,整个过程简单快捷,无需下载任何软件,在手机和电脑上都能随时流畅使用。

单位名称种类说明示例
pxPixelsabsolute屏幕上的一个像素。最基本的单位。font-size: 16px;
emEmrelative父元素字号的倍数。padding: 1.5em;
remRoot Emrelative根元素(html)字号的倍数。margin: 2rem;
%Percentrelative相对于父元素对应属性的百分比。width: 50%;
vwViewport Widthviewport视口宽度的 1%。width: 100vw;
vhViewport Heightviewport视口高度的 1%。height: 100vh;
vminViewport Minviewportvw 与 vh 中较小值的 1%。font-size: 5vmin;
vmaxViewport Maxviewportvw 与 vh 中较大值的 1%。width: 50vmax;
dvhDynamic VHviewport动态视口高度(计入移动端地址栏)。height: 100dvh;
svhSmall VHviewport最小视口高度。min-height: 100svh;
lvhLarge VHviewport最大视口高度。max-height: 100lvh;
chCharacterrelative基于字符“0”的宽度。max-width: 60ch;
exX-Heightrelative基于字符“x”的高度。line-height: 2ex;
cmCentimetersabsolute厘米。用于打印。width: 10cm;
mmMillimetersabsolute毫米。用于打印。margin: 5mm;
inInchesabsolute英寸(1in = 96px)。width: 2in;
ptPointsabsolute磅(1pt = 1/72in)。font-size: 12pt;
cqiContainer Inlinecontainer容器行向尺寸的 1%。font-size: 5cqi;
cqbContainer Blockcontainer容器块向尺寸的 1%。padding: 2cqb;
19개 표시 중
嵌入

将此工具嵌入你的网站

Powered by Patrache Studio DevTools
最后更新:2026 · 免费在线工具

什么是 CSS 单位参考?

免费在线CSS单位参考,按类别整理px、em、rem、%、vw、vh、vmin、vmax、ch等单位的用途与用法,并说明绝对单位与相对单位的换算关系和常见取值场景。 可在编码时于一处快速查阅代码、符号、快捷键等参考信息,在浏览器中即时搜索和复制,无需注册或安装即可免费使用。 结果可一键复制,整个过程简单快捷,无需下载任何软件,在手机和电脑上都能随时流畅使用。

使用方法

  1. 1
    输入— 输入所需数据。
  2. 2
    结果— 查看处理结果。
  3. 3
    复制— 复制结果使用。

相关工具

PX-REM 转换器以可自定义的根字号为基准在CSS的px和rem单位间双向转换,支持小数值,并提供可复制的参考表和CSS代码片段的免费在线工具 适用于开发和数据处理时需要在 CSV、JSON、颜色、时间等不同格式之间转换的场景,全部在浏览器本地完成,输入数据不会上传服务器,无需安装或注册即可免费使用。 结果可一键复制,整个过程简单快捷,无需下载任何软件,在手机和电脑上都能随时流畅使用。
浏览器兼容性检查免费在线浏览器兼容性查询工具,显示某项CSS、JavaScript、HTML或Web API特性在Chrome、Firefox、Safari和Edge中的支持版本。 可在编码时于一处快速查阅代码、符号、快捷键等参考信息,在浏览器中即时搜索和复制,无需注册或安装即可免费使用。 结果可一键复制,整个过程简单快捷,无需下载任何软件,在手机和电脑上都能随时流畅使用。
CSS 渐变生成器免费在线可视化工具,设计linear、radial、conic渐变,调整颜色停止点和角度,一键复制网页背景的CSS代码。 适合在测试和开发中即时生成所需数值,所有生成过程都在浏览器本地运行,数据不会上传服务器,无需安装或注册即可免费使用。 结果可一键复制,整个过程简单快捷,无需下载任何软件,在手机和电脑上都能随时流畅使用。
CSS 盒子阴影生成器免费在线CSS box-shadow生成器,可调节偏移、模糊、扩散、颜色和内阴影inset并实时预览阴影,生成可复制的box-shadow CSS代码。 适合在测试和开发中即时生成所需数值,所有生成过程都在浏览器本地运行,数据不会上传服务器,无需安装或注册即可免费使用。 结果可一键复制,整个过程简单快捷,无需下载任何软件,在手机和电脑上都能随时流畅使用。

常见问题

免费在线CSS单位参考,涵盖所有CSS长度、角度、时间单位。

不会。所有处理都在浏览器中完成。

是的,响应式设计支持移动设备。

本站使用 Cookie 以改善体验和投放广告。 了解更多

请允许此网站展示广告

要使用这些工具,请关闭对此网站的广告拦截。广告收入支持我们免费提供服务。

点击广告拦截器图标,关闭对此网站的拦截,然后重新检查。