本文介绍非常实用的CSS相对颜色语法,可以解构现有颜色,轻松实现相邻色、反色、半透明色等效果,有效减少项目的CSS颜色变量数量。
“CSS相关”目录存档
全新的CSS相对颜色语法-使用from和calc()
2024年12月11日,星期三哇哦,font-palette支持动画和palette-mix()混合函数了
2024年12月4日,星期三font-palette彩色字体又支持新特性了,一是可以使用palette-mix()实现基础模板的颜色混合,二是支持animation和transition动画了,至此Web字体渲染的表现力更上一层楼。
CSS好用的color-mix颜色函数也可以使用啦
2024年11月29日,星期五目前所有现代浏览器都已经支持color-mix()这个颜色函数了,这个函数可以实现关键字颜色值的半透明表示,是其他CSS、JS语法都无法取代的实用特性,本文还有色调插值方法的介绍。
CSS Grid布局中的subgrid的适用场景
2024年11月25日,星期一subgrid这个子网格特性当时Grid布局出来之后,呼声很高,现在终于支持了,非常适合那种比较规整的多层次嵌套的布局,赶快来了解一番吧。
这啥?CSS calc-size和interpolate-size,真学不动了
2024年11月14日,星期四好消息,height:auto、width:fit-content这些以前无法触发transition过渡效果的CSS声明,现在也能动画啦,就是使用calc-size()函数或interpolate-size属性。
Nice! Safari也支持CSS @property规则了
2024年10月10日,星期四CSS @property规则最具代表性的作用是扩大了CSS动画和CSS过渡效果的应用范围,还是挺实用的一个Houdini特性。
时隔两年,Chrome也支持round等CSS数学函数了
2024年09月26日,星期四最近Chrome进行了第4批CSS数学函数的支持,包括mod()/rem()/round(),其中round()函数尤为的实用。
好消息,align-content垂直居中也适用普通元素啦
2024年09月13日,星期五之前使用align-content控制元素的垂直对齐仅适用于Flex或Grid元素,而现在,Block元素也能使用啦!
不能落后,好好缕缕CSS滚动动画
2024年08月23日,星期五CSS滚动动画比我预想的要强多了,项目中又有很多JavaScript代码可以淘汰了。
页面级可视动画View Transitions API初体验
2024年08月10日,星期六View Transitions API可以让页面元素在无需设置具体定位属性值的情况下实现各种各样的动画效果,是个很强很有用的新特性。