本文的3个效果都是源自我最近做的几个真实的项目，是canvas领域基本入门的一些效果。代码我都专门重新梳理了下，必要注释也都加上去了，方便大家的学习……
理解CSS3 max/min-content及fit-content等width值
2016年05月20日 by 阅读 155117 次, 今日 15 次在CSS3的世界里，width属性又多了几个关键字成员，fill-available, max-content, min-content, 以及fit-content。
本文就将分析与介绍这几个关键字，顺便帮忙理一下CSS世界中的尺寸概念，相信本文的内容不仅对于CSS3的学习，包括对CSS2.1整个尺寸的认知都会有一定的帮助。
CSS3 filter:drop-shadow滤镜与box-shadow区别应用
2016年05月18日 by 阅读 124239 次, 今日 5 次要使用标准的CSS3实现某元素的投影效果，有两个套路，第一个就是使用常见的box-shadow, 第二个就是使用CSS3的filter阴影滤镜drop-shadow，那这两个阴影实现有什么具体的差异呢？
本文就将探讨此问题，其实主要目的还是介绍下相当了不得的drop-shadow滤镜。
改变CSS世界纵横规则的writing-mode属性
2016年04月27日 by 阅读 144874 次, 今日 5 次
writing-mode这个CSS属性，我们是不是很少见到，很少用到！我们往往称不常见的东西为“生僻”，就像是不常见的文字我们叫“生僻字”，因此不常见的CSS属性，我们可以叫做“生僻属性”，writing-mode给我们的感觉就是一个“生僻属性”，很弱，可有可无。
但是，实际上，我们都错了，大错特错，writing-mode很弱？卧槽，别开玩笑了，writing-mode可以说是CSS世界里面最逆天的CSS属性了，直接颠覆CSS世界的众多规则……
本月为4月压轴作品，大量demo，大量脑洞大开的创意处理，希望可以对您的学习有所帮助。
了解HTML/HTML5中的download属性
2016年04月6日 by 阅读 192207 次, 今日 18 次如果我们想实现点击下载按钮下载一张图片，你会如何实现？
我们可能会想到一个最简单的方法，就是直接按钮a标签链接一张图片。
但是，想法虽好，实际效果却不是我们想要的，因为浏览器可以直接浏览图片，因此，我们点击“下载”链接，并是不下载图片，而是在新窗口直接浏览图片……
简单了解CSS3的all属性
2016年03月24日 by 阅读 46622 次, 今日 3 次all属性实际上是所有CSS属性的缩写，表示，所有的CSS属性都怎样怎样，但是，不包括unicode-bidi和direction这两个CSS属性。
为什么会有这个CSS属性呢？
我们可能知道，有些CSS属性值基本上所有CSS属性都有，比方说继承inherit!
我们CSS reset输入框的时候，是不是有类似这样的代码…
以20像素为基准的CSS网页布局实践分享
2016年03月22日 by 阅读 192170 次, 今日 50 次以20像素为基准进行CSS网页布局，说不定会让一些细节和潜能大放光彩，当然这需要体系的配合，还需要一些完整的解决方案在里面，本文就将分享这一实践心得，保证是其他地方都没有的。外甥点灯笼——照旧(舅)，有demo有截图有必要的源代码展示，希望本文的内容能够对您的学习有所帮助！
CSS direction属性简介与实际应用
2016年03月20日 by 阅读 64412 次, 今日 8 次至少，在我接触的这么多项目里，没有见到使用过CSS direction属性做实际开发的。
为什么呢？是因为direction长得丑吗？
虽然说direction确实其貌不扬，但是CSS并不是一个看脸卖萌的世界。
那是因为兼容性吗？
那更不是了，在那个“美女”确实是美女的年代，包括IE6在内的浏览器，CSS direction就已经被支持……
腾讯微云黑色遮罩引导蒙版更好的CSS实现方式
2016年03月7日 by 阅读 85683 次, 今日 7 次网站有一些改动的时候，为了让用户熟知新的操作位置，往往会增加一个引导，常见的方式就是使用一个黑色的半透明蒙版，然后需要关注的区域是镂空的。
然后上周五我去微云转悠的时候，也看到了引导层，于是职业病又犯了，去学习下别人是怎么实现的。下面是观测的结果：
为了实现镂空蒙层效果，作者发挥了小时候拼积木的才能，使用两层HTML结构，内层使用5块独立区域拼接形成，至于中间镂空的区域的阴影则是使用的图片实现的。
我们实际上只需要一层标签，一层空标签就可以实现我们的效果，且不需要图片……
SVG精简压缩工具svgo简介和初体验
2016年02月29日 by 阅读 115344 次, 今日 9 次SVG文件，尤其从各种变假期导出的SVG，通常包含大量的无用信息，例如编辑器源信息，注释，因此元素，默认或者非最优值，以及其他一些不会影响渲染结果的可以移除或转换的内容。
有没有什么工具可以简化这些信息呢，有，不妨试试本文介绍的svgo.
我的应用
我的应用