时隔两年，Chrome也支持round等CSS数学函数了
💡
原文中文，约4600字，阅读约需11分钟。
📝
内容提要
文章介绍了CSS中的mod()、rem()和round()函数。mod()和rem()用于计算余数，round()用于取整，支持多种方法。round()在开发中很实用，如确保响应式字体大小为整数，避免图标缝隙，还能模拟animation的steps()效果。文章还提到CSS其他数学函数的支持进展。
🎯
关键要点
- CSS中的mod()、rem()和round()函数现在在Chrome浏览器中也得到了支持。
- mod()函数用于计算余数，类似于JavaScript的余数运算符。
- rem()函数返回第一个参数除以第二个参数后的余数，功能与mod()相似。
- mod()和rem()函数在日常开发中使用机会较少。
- round()函数设计巧妙，支持多种取整方法，如向上取整、向下取整、四舍五入等。
- round()函数可以确保响应式字体大小为整数，避免图标和边框出现缝隙。
- round()函数的最后一个参数可以模拟CSS动画中的steps()效果。
- CSS中其他数学函数的支持进展包括min()/max()/clamp()、sin()/cos()、sqrt()、pow()、exp()和log()等。
- Chrome浏览器对数学函数的支持是分批进行的，尚未一次性支持所有函数。
➡️
