2. CSS 中的单位

CSS 中的单位

CSS 新单位:vmin 和 vmax

  1. vmin

vmin 表示相对于视口宽度和高度中较小者的百分比。

  1. vmax

vmax 表示相对于视口宽度和高度中较大者的百分比。

例如,如果视口的宽度为 1000px,高度为 800px,那么 1vmax 就等于 10px(即 1000px 的 0.1),1vmin 就等于 8px(即 800px 的 0.1)。

使用 vmin 和 vmax 单位可以根据视口的宽度和高度来设置元素的大小,实现响应式布局。

CSS 新增的单位 ch

在 CSS 中,ch 是一个相对单位,它代表数字 0(零)的宽度,在当前的字体和字体大小下的度量。这个单位特别适用于需要基于字符宽度进行布局的场景,比如保持文本的垂直对齐或者在元素内部确保一定的空间以容纳文本字符。

相关推荐
前端那点事几秒前
Vite+Vue3环境判断终极解法!区分开发/生产环境,告别环境报错
前端·vue.js
源码集结号2 分钟前
基于 Spring Boot + JPA + MySQL的上门家政系统代码示例
java·前端·后端
爱喝铁观音的谷力景辉5 分钟前
web端实现音频波形分析以及音频截取
前端
前端那点事11 分钟前
别再乱用Vue3路由!useRoute/useRouter传参、跳转、避坑最全实战指南
前端
LIO1 小时前
深度解析 localStorage 与 sessionStorage:用法、区别与最佳实践
前端
Amy_yang1 小时前
uni-app 中 web-view 的使用与 App 端全屏问题处理
前端·javascript·vue.js
闲坐含香咀翠1 小时前
Electron 加载原生模块总崩溃?搞懂这两行配置就够了
前端·electron·客户端
拉拉肥_King2 小时前
pc端视频压缩:FFmpeg.wasm 实战指南
前端
0x862 小时前
基于 Dio 实现 SSE 流式通信
前端
ZC跨境爬虫2 小时前
跟着 MDN 学 HTML day_40:(DOMImplementation 接口完全解析)
前端·ui·html·媒体