想写一篇关于 SVG 滤镜的文章已久，SVG 滤镜的存在，让本来就非常强大的 CSS 如虎添翼。让仅仅使用 CSS/HTML/SVG 创作的效果更上一层楼。题图为袁川老师使用 SVG 滤镜实现的云彩效果 -- CodePen Demo -- Cloud (SVG filter …

在 CSS 的浩瀚宇宙中，聚光灯下的明星属性固然耀眼，但那些藏在规范角落的「小众特性」，往往才是提升开发效率的秘密武器。它们就像隐藏的工具箱，能帮我们用更少的代码实现更细腻的交互，让界面开发从繁琐走向

本文从两个常见的 CSS 属性 background-color和background-image 入手，思考它们之间的关系，进而引出两个用于混合色彩的 CSS 属性。

2025年CSS新特性解析：构建更高效、更优雅的现代网页 随着Web技术的快速发展，CSS作为网页设计的核心语言，近年来不断推陈出新。2025年，CSS迎来了一系列激动人心的新特性，这些功能不仅提升了

众所周知，有些属性是不支持过渡动画的，比如高度auto 效果如下 要实现过渡效果，之前提供过一个grid布局方式，原理是利用grid的尺寸单位1fr支持过渡的特性，有兴趣可以回顾这篇文章： 不过到了现

使用SVG绘制一个环形进度条。通过定义SVG的基本元素，如圆形和轮廓，并使用stroke-dasharray属性设置轮廓的样式，可以实现任意角度的环形进度条。

最近，Chrome团队发布了对一个新的CSS规范的实验性支持，即样式查询。简而言之，它让我们查询容器的样式，而不是只查询尺寸。在查询容器尺寸不够的情况下，这可能很有帮助。 CSS 容器查询 介绍样式查

所有新的、实验性的颜色功能都是有原因的，CSS正在引入这些功能。而它们所激起的所有兴奋也是有原因的。 颜色是困难的。定义一个基本的调色板可能很耗时，而且涉及到很多利益相关者。这还没有考虑到上下文的颜色

... 上面这些问题可能我们在开发中已经知道如何解决，但是问题产生的原理，以及解决方案的原理可能会模糊不清。在解决这些问题的过程中，我们往往会遇到非常多的概念：像素、分辨率、PPI、DPI、DP、DIP、DPR、视口等等，你真的能分清这些概念的意义吗？ 本文将从移动端适配的基础…