CSS的美

最近又来研究悬停特效了，因此这次带来一个box-shadow版的悬停效果，这个效果简单易学。对于悬停效果，我在之前已经写过好几篇相关的文章，感兴趣的小伙伴可以翻阅我之前的文章看一看。接下来咱们话

又简简单单地过了一周，这回给大伙带来一个新的前端特效，我把它命为-我裂开了。这个特效呈现的效果就是给背景图片加上一种裂开效果，大家可以接着往下看。 效果预览 这个效果其实就是一个撕裂特效

这次给大家带来的是一个类似蚊香一样的效果，这个效果还是非常具有视觉欣赏性的，相比前几篇文章的CSS特效，这一次的会比较震撼一点。 效果预览 从效果上看感觉像是一层层蚊香摞在一起

看到这个标题，相信有人会感到疑惑，什么是方向感应卡片组？这是一个控制效果，这里简单举个例子，方向感应，就是可以跟随方向的变化跟随之变化，当我们鼠标放在其中一张卡片上的时候，其余的卡片就会朝着这张

相信大伙都知道悬停效果吧，鼠标悬停的应用场景非常多，它是一个比较常见的功能。因此基于鼠标悬停来扩展的效果也是非常多的，今天就带大家来实现一个在文字上进行悬停分割的效果。

这段时间比较闲，最近慢慢地又研究上了 CSS 特效，今天给大家带来一个超容易实现的特效 —— 字符跳动。之所以说它简单，是因为它的代码简短，通俗易懂，希望大家都能学会。 效果预览 字符跳动效果

这次给大家带来一款简单又炫酷的爱心加载特效，用通俗易懂的代码实现炫酷的特效，相信这是很多人都想做的事。接下来就跟随我的步伐来完成这个炫酷的特效吧。

这回整点不一样的，使用原生js代码来实现粘性导航栏。粘性导航栏大伙肯定都有所了解，其实通过定位属性中的粘性定位sticky也是可以实现的。但是今天我们就是不走寻常路，使用原生js来实现它。

在上一次的文章中我们实现了一个“七珠合一”效果，这回给大伙带来的是一个更加炫酷好看的特效，一个旋转钻石背景送给大家。乍眼一看，是不是有点像模型图。 效果预览 具体效果可以参考下面的码上掘金

不知道大伙有没有见过下面这种效果。 没错，这回给大伙带来的是一个锯齿形边框，类似于传统邮票的边框，有一圈锯齿形状，具体效果可参考下面的码上掘金。其实看到这种效果，相信很多人第一反应是采用伪元素的

这回给大伙带来一个效果上看我们暂且称它为“七珠合一”的效果，大伙可以看看下面码上掘金的效果预览。话不多说，咱们直接开写。

慢慢地我又写上了关于CSS的文章，这次给大伙带来的是一个模拟手机信号的效果，就是手机最右上角的那几格信号。 具体效果可参考下面码上掘金。

这次又很久没有更新文章了。这次趁着周末下午的闲暇时刻来更新一下文章，这回给大伙带来的是一个波浪动画，具体效果可以参考下面的码上掘金效果预览。

前这次带来的是一个非常丝滑的鼠标移动特效，移动鼠标的时候可以有放大镜效果，具体效果可以查看下面的码上掘金。 效果预览 jcode 当鼠标移动到某一处位置时，便会出现一个类似于放大镜的效果

前面介绍了那么多朴素无常的特效，这次带来一个炫酷的望花筒特效。望花筒特效是一种基于 CSS3 的特效，可以用来实现网页的动态背景效果。

这次给大家带来的是一个具有视觉效果的液体球特效。液体球特效是一种视觉特效，它可以模拟出液体在球体中运动的效果，让大家感觉到液体在球体内部自由流动、变形、翻滚等动态效果，从而增强画面的视觉冲击力

大家都经历过在屏幕上出现卡顿的情况吧，它会出现很多小像素方块，这种效果被称作为电视噪音效果。因此这次带来的是一款电视噪音特效，模拟电视噪音。

书接上回，在上次我们用SVG实现了黏糊糊效果，这一次将使用最基础的HTML、CSS、JS三件套来完成这个黏糊糊效果，不过最终呈现的效果会和SVG实现的有所不同。

码上掘金月赛又又又又开始了，我又来参加了，这次的赛题分为动画和 Todolist。这两个赛题方向其实都可以试试，不过我最后还是选择了 Todolist，主要是因为动画做过太多次了

如何使用纯 CSS 来实现这样一个翻书效果呢？于是，抱着试一试的心态，使用纯 CSS 做了一个翻书的效果来体验一下。下面是最终效果。