在前端开发过程中，我们也有可能遇到噪点插画风格的设计稿，本文主要内容主要就是通过几个示例来实现几种噪点效果。本文包含的知识点包括：CSS 属性 mask 遮罩、SVG 滤镜 feTurbulence、

在 WeGame 的 PC 端官网首页，有着非常多制作精良的基于滚动的动画效果。 这里我简单截取其中 2 个比较有意思的转场动画，大家感受感受。转场动画 1： 转场动画 2： 是不是挺有意思的，整个动

本文将介绍一种配合 SVG 滤镜实现各种不规则图形添加边框的小技巧。 在我们日常开发中，时长会遇到一些非矩形、非圆形的图案。类似下面这些： 使用纯 CSS，搭配一些技巧，是可以制作出上面的图形的，当然这只是需求的第一步。 紧接着，可能会有要给上述图形添加边框的诉求，这个时候，C…

觉得它的风格很独特，尤其是其中一些边框。 嘿嘿，所以来一篇边框特辑，看看运用 CSS，可以在边框上整些什么花样。 谈到边框，首先会想到 border，我们最常用的莫过于 solid，dashed，上图中便出现了 dashed。 除了最常见的 solid，dashed，CSS b…

本文的主题是 Glitch Art，故障艺术。 什么是故障艺术？我们熟知的抖音的 LOGO 正是故障艺术其中一种表现形式。它有一种魔幻的感觉，看起来具有闪烁、震动的效果，很吸引人眼球。 故障艺术它模拟了画面信号出现故障导致成像错误的感觉。青色色块与红色色块无法重合就是这种故障的…

《CSS系列漫画教程》共15讲，是我2012年刚毕业步入互联网时的早期作品。时隔多年，如今互联网内容为王的分享经济迅速发展，这些作品压箱底太可惜，不如分享给大家。 漫画还停留在当年前端兼容ie6的时代，如今ie6随着那一代人的青春一起逝去，大家各奔前程，留下是感情和回忆。漫画不…

一般我们最普遍的使用方法是将HTML属性放进一个方括号中，称之为属性选择器。例如： 任何具有href属性且没有更具体的选择器的html元素现在都会变成黄绿色。属性选择器的特性和类选择器一致 但是你可以使用属性选择器做更多的事情。就像你的DNA一样，它们具有嵌入式的逻辑，可帮助您…

优点：1. 完整显示图标；2. 减少请求数量； 缺点：1. 色彩丰富的图片转成 base64 效果不好；2. 会增大图片提及，相当于用下载时间换取请求时间； 好了，这篇分享就说到这里，初次写文章，语句和方式难免有瑕疵，望各位看客老爷见谅。

你可能已经在你的项目中用上了CSS Animation和CSS transition。如果还没有用上，那你有点out了。快去看下CSS-Trick上的这两篇关于animation和transition的文章。你在使用中一定发现了有些动画很流畅，而有些则很卡。为什么呢？