如果你刚刚听说了最新的 CSS 特性，你很想在你的代码中使用它，但是你的老板仍然想支持旧的浏览器。通常，这将是您使用现代 CSS 功能梦想的终点，但幸运的是，情况并非如此。@supports 也称为功能查询，允许您根据浏览器对给定功能的支持使用不同的 CSS 样式。这意味着您最终可以在不破坏旧浏览器支持的情况下使用现代 CSS 功能。虽然它已经很早就有了，但是很多人都不知道，所以在这里分享一下！
2024年08月31日
如果你刚刚听说了最新的 CSS 特性，你很想在你的代码中使用它，但是你的老板仍然想支持旧的浏览器。通常，这将是您使用现代 CSS 功能梦想的终点，但幸运的是，情况并非如此。@supports 也称为功能查询，允许您根据浏览器对给定功能的支持使用不同的 CSS 样式。这意味着您最终可以在不破坏旧浏览器支持的情况下使用现代 CSS 功能。虽然它已经很早就有了，但是很多人都不知道，所以在这里分享一下！
2024年08月31日
我们都有在网页上见过一些交互性的效果，比如用鼠标滑向图标或是按钮的时候，图标会自动旋转一周，这就是CSS3旋转效果。在CSS3中有个常见的transform应用，transform主要包括以下几种：旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。本文主要侧重讲解CSS3的平面旋转（2D）方法和立体旋转（3D）方法。不过既然提起transform，还是先普及一下transform属性的基本知识：
2024年08月31日
先上资源地址：https://github.com/chokcoco/CSS-Inspiration
这个资源是众多的CSS特效实现方法。
布局，动态特效，模糊等等。如果想要提高自己的CSS水平，可以关注研究下实现。
2024年08月31日
transform：可以对元素对象进行旋转rotate、缩放scale、移动translate、倾斜skew、矩阵变形matrix。
示例：
2024年08月31日
CSS 中的 position 属性只有几个有效值，但这些值会导致无穷无尽的设计可能性，这使得学习定位相当困难。 在本文中，我将分解每个位置值并解释您需要了解的有关它们的所有信息。
2024年08月31日
之前在项目的过程中遇到了一个问题，某个 div 希望始终显示在最上面，而在之后的元素都显示在它之下，当时设置了 z-index 也没有效果，不知道什么原因，因此找了一下 CSS 相关资料，解决了这个问题的同时，也学习了很多知识，特此和大家分享一下。
屏幕是一个二维平面，然而 HTML 元素却是排列在三维坐标系中， x 为水平方向， y 为垂直方向， z为屏幕由内向外方向，我们在看屏幕的时候是沿着 z 轴方向从外向内的。由此，元素在用户视角就形成了层叠的关系，某个元素可能覆盖了其他元素也可能被其他元素覆盖；
2024年08月31日
性能优化是自身和项目发展到一定程度都避不开的话题，性能优化需要从多个维度进行，比如资源部署、缓存方案、资源压缩、http协议、代码实现、异步加载等都有优化的空间。
今天给大家讲解一下css是如何做性能优化的。
2024年08月31日
实现3d效果旋转跳跃的立方体，CSS3中具有的perspective就是为了设置井深，创建一个3D的环境，而transform-style就是为了创建3d环境。
井深：指视觉与平面的距离，使具有三维位置变换的元素产生透视效果，就是我们理解的【Z轴】。 从视觉上观察，值越大看起来距自己越近，元素整体越大；值越小，越远，元素整体越小。在设计中给需要3D的盒子的父级设置井深，让其具有立体透视效果 ，通常perspective使用的值800px或者1200px ，这两个值从视觉上看比较舒服，也可以根据需求自行设置。
2024年08月31日
很早之前我们推荐大家看《推荐大家使用的CSS书写规范、顺序》，里面提到 CSS 的一些常用命名、规范等等，而今天主要是说一些偏门一点的 CSS 样式、技巧。
什么是偏门，就是有些片段很少使用，时间久了就记不起来，但用的时候又要去找，所以这里为大家整理一些少用但又实用的 CSS 样式，