DEV Community · Show DEV9/2 08:4162

我意外重造了CSS progress()并发布了它

I accidentally reinvented CSS progress() and then I published it anyway.

阅读原文
作者在查看朋友Stavros Lazaris发布的CSS框架Zeus时,受到其流体引擎启发,该引擎使用clamp()和cqi单位实现间距和字体随容器缩放。作者发现该公式在非长度属性(如transition-duration、font-weight、opacity等)上失效,因为cqi是长度单位,不能与时间等混合,导致声明被浏览器丢弃。为解决此问题,作者通过重新排序(先除后乘)修复,并意外重造了CSS的progress()函数,最终将其发布为npm包。文章还提供了实用的CSS技巧,并分享了这一过程中的尴尬经历。