为了便于更好的理解本文，下面对像素相关概念进行梳理。概念描述像素px是图像显示的基本单元，相对单位。设备像素(物理像素)dpdevicepixels，显示屏就是由一个个物理像素点组成，屏幕从工厂出来那

详细介绍了如何使用 CSS 实现无限滚动动画的两种方法。一是通过绝对定位和动画延时；二是利用双份元素进行动画循环。

最近，在 CodePen 上看到这样一个非常有意思的效果： 这个效果的核心难点在于气泡的一种特殊融合效果。 其源代码在：CodePen Demo -- Goey footer，作者主要使用的是 SVG

继爆款《苹果官网Ipad mini滚动动画实现原理探究》文章后，再续苹果官网iPad Air炫酷的绝版颜色切换动画，让你学会熟练使用SVG技术做出漂亮的路径动画效果，实现SVG动效的举一反三的能力。

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

性能优化是把双刃剑，有好的一面也有坏的一面。好的一面就是能提升网站性能，坏的一面就是配置麻烦，或者要遵守的规则太多。并且某些性能优化规则并不适用所有场景，需要谨慎使用，请读者带着批判性的眼光来阅读本文。 本文相关的优化建议的引用资料出处均会在建议后面给出，或者放在文末。 1. …

Grid 布局即网格布局，是一种新的 CSS 布局模型，比较擅长将一个页面划分为几个主要区域，以及定义这些区域的大小、位置、层次等关系。号称是最强大的的 CSS 布局方案！！

前两天在网易云听歌的时候，看到有个功能叫鲸鱼音效，点进去长下面这个样子。这是一个很常见的音乐律动动画，在音乐播放的过程中，CD 周围的曲线抖动，给听者带来一些听觉视觉上的双重冲击。 今天尝试用代码来实现一个【类似】的效果，着急的朋友可以跳过文章，直接查看最终效果。喜欢的朋友不要…

前两天在浏览 苹果 16寸 营销页面 的时候，发现了几个比较有意思的交互，心里想着自己虽然是一个穷逼，但是知识是无界限的呀，于是便研究了一波。 一个是屏幕慢慢打开的效果，在屏幕打开的过程中，电脑图片 是在屏幕中固定不动的，直到打开完毕或者关闭完毕的时候再让 电脑图片 随着滚动条…