CSS
有趣的CSS小示例：好看的皮囊千篇一律，有趣的灵魂万里挑一
Javan
文字加载...动画 html 正在加载中<dot>...</dot> css dot{ display: inline-block; height: 1em; line-height: 1; text-ali…
CSS3中Flex弹性布局该如何灵活运用？
前言 Flex（Flexible Box），意为”弹性布局”。“弹性”，顾名思义，就是具有弹簧的特性啦，能够自由的伸缩（有点自适应的意思啦）。 其实Flex并不是最近才出现的，而是早在十年前它就被提出。2009年，W3C提出了一种新…
如何快速上手基础的CSS3动画
前言 说起CSS3动画，就必须说说 transform，translate，transition，animation这4个属性，transform主要定义元素的动作，比如旋转、倾斜、位移等，translate是transform里面…
CSS3中用background-image实现粒子动画效果
前言 继续前几天的文章《王者荣耀匹配人员加载页面动画用纯CSS撸出来，你信吗？》，添加按钮、背景粒子动画效果。 其实在码代码的时候会发现，很多东西都是殊途同归的，方法千千万，能解决问题的都是好办法，不一定非要把代码写的特别高深，这样…
CSS3线性、径向渐变、旋转、缩放、动画实现王者荣耀匹配人员加载页面
前言 日子总是像从指尖流过的细沙，在不经意间悄然的滑落。转眼2019年第一季度已经过去了，提前祝大家愚人节快乐，当心被人愚弄哦（就算被愚弄也不要生气啦）。 先来看看今天要实现的效果原图： 玩过王者的应该都熟悉，这个页面的效果。为什么…
如何提升你的CSS技能，掌握这20个css技巧即可[完整版]
前言 随着前端开发越来越关注效率：通过选择器的使用和简化代码来快速加载渲染。像Less、SCSS这样的预处理器在工作的时候，需要绕的路较长，而直接使用css速度会更快。这里涵盖了20个css技巧来帮助你减少重复规则和复写，在布局中标…
VS Code中6个令人惊叹的CSS扩展
VS Code中6个令人惊叹的CSS扩展 前言 Visual Studio Code最令人印象深刻的部分之一是可定制性，尤其是通过扩展。随着大量开发人员创建扩展，功能实际上是无穷无尽的！ 作为一名程序猿，或多或少都会码一点点CSS，…
css3简易的天气图标动画特效
前言 前面文章《CSS3线性渐变、阴影、缩放实现动画下雨效果》实现了下雨的动画效果，现在我们来绘制更多天气相关的动态图标。 上图6种天气，我们就分开一一展示给小伙伴们，希望能给大家带来帮助。 晴朗 <div class="ic…
CSS3径向渐变实现优惠券波浪造型
前言 “等风来不如追风去，追逐的过程就是人生的意义”。 借朋友吉言，“2018在头条，2019成为头条”，这就是我2019的目标，我已经在追风的路上。你呢？不要停下脚步，继续前行吧。 今天来个实用的小知识，看下图： 很多人看到左右的…
利用CSS线性渐变、阴影、缩放实现动画下雨效果
前言 好雨知时节，当春乃发生。 随风潜入夜，润物细无声。 春节已经过去，新的一年刚刚开始，小伙伴们，今年你的目标是什么？定个小目标，挣他一个亿？分享一下我的目标，是让大家的web前端能力，更上一层楼。 下面进入主题，看下图： 这个动…