聊聊min(),max()和clamp()函数

AI摘要
Deepseek提供支持

Caniuse.com中的数据可以得知,到写这篇文章为止,min()max()clamp()函数已经得所有主流浏览器的支持了。说要做好相应的降级处理。

虽然说这几个函数得到主流浏览器的支持,但要用于实际项目中时,还是需要谨慎,或者说要做好相应的降级处理。比如人肉做降级处理:著作权归作者所有。

广告
广告图片

.element { font-size: 20px; 
font-size: clamp(20px, 
(1rem + 3vw), 40px)
 }

也可以通过@supports来做条件判断:

.element { font-size: 20px; } @supports (width: min(10px, 3vw)) { .element { font-size: clamp(20px, (1rem + 3vw), 40px) } }
广告
广告图片
温馨提示 : 非特殊注明,否则均为©李联华的博客网原创文章,本站文章未经授权禁止任何形式转载;来自:俄亥俄州·哥伦布 ,欢迎您的访问!
文章链接:https://www.lilianhua.com/talk-about-the-min-max-and-clamp-functions.html
请先登录才能参与答题
距本场结束剩 00 00 00 00
轻量应用服务器 2核2G
200M峰值带宽,适用于网站搭建、Web应用、容器环境、电商独立站等
立即前往
扫码进入
扫描二维码购买
文澜千文

文澜千文

请登录以使用此功能。

|
盐津铺子薯片休闲零食多口味礼盒烘焙非油炸膨化零食整箱490g14小包 盐津铺子薯片休闲零食多口味礼盒烘焙非油炸膨化零食整箱490g14小包
弹窗图片

Linux AI

记不住繁琐的Linux参数?让AI为你精准检索!输入你的需求,一秒锁定标准命令,彻底告别搜索引擎的冗长翻找。

Loading...
OpenClaw

OpenClaw 龙虾

AI AGENT GATEWAY
在您的服务器部署 OpenClaw,打造专属极速 AI 助手。
零门槛一键部署环境
支持 QQ/飞书/微信 渠道
跨平台指令分发执行
立即安装