“CSS相关”目录存档

今日学习CSS文本自定义高亮API

2024年07月18日,星期四

文本高亮封面占位图

随着Firefox 131也支持了CSS Custom Highlight API,至此,所有现代浏览器下都可以实现无标签的文本内容高亮效果了。

阅读全文…

了解infinity、pi等CSS calc()计算关键字

2024年07月15日,星期一

封面图-蒲公英

CSS calc()计算函数又新增了infinity,NaN,pi等关键字,都来了解下是干嘛用的吧。

阅读全文…

如何使用纯CSS鉴别是不是Safari浏览器

2024年07月4日,星期四

封面太阳能图

列举了我目前所知的N多种纯CSS判断是不是Safari和iOS Safari浏览器的方法,希望可以对你的工作有所帮助。

阅读全文…

CSS transition-behavior让display none也有动画效果

2024年06月30日,星期日

水果西瓜封面占位图

现在,CSS已经有能力让元素display:none元素显示与隐藏的时候有transition动画效果了,分别靠@starting-style规则和transition-behavior属性,什么,这些你都不认识?那还不进来看看究竟是什么新特性。

阅读全文…

告别JS浮层,全新的CSS Anchor Positioning锚点定位API

2024年06月27日,星期四

CSS锚点定位占位封面图

CSS锚点定位应该是2024年最期待的CSS新特性了,断断续续两周才写完,今天必须要带大家长长见识。

阅读全文…

如何用简单的Web方法实现图片的马赛克效果

2024年05月20日,星期一

封面占位图

本文介绍两种Web中实现图片马赛克的方法,一个是SVG滤镜的,一个基于某个CSS属性的,都比较简单,不复杂。

阅读全文…

CSS Nesting嵌套与@scope规则也太雷同了吧?

2024年03月31日,星期日

封面占位图

既生瑜何生亮,没想到CSS有语法和作用如此相似的两套规则,一个是范围,一个是嵌套,大部分时候两者可以互相替换,怎会如此呢?

阅读全文…

CSS initial-letter属性,嗯……也就这样吧

2024年03月21日,星期四

封面占位图

带大家快速了解下CSS initial-letter属性,可以更好地设置首字母的排版效果。

阅读全文…

CSS @scope他来了

2024年01月21日,星期日

仙人掌封面图

从名称上看,@scope似乎是实现CSS作用域的,这个讨论了近20年的特性终于是要支持了吗,还是并非如此?

阅读全文…

5分钟快速了解text-wrap:balance的作用

2023年07月25日,星期二

没想到,以前有些不方便实现的排版和布局效果可以使用text-wrap:balance轻松实现。

阅读全文…