很多人只要一提到@font face规则，心中就会不由自主“哦~~”的一声：“这个我知道，可以用来生成自定义字符小图标！”话是没错，问题在于很多人就以为生成字符小图标就是@font face规则的全部，实际上只是功能之一，如果真正了解@font face规则，你会发现，@font face规则可以做的事情其实非常多，尤其我们不考虑IE7，IE8浏览器的情况下……
真正了解CSS3背景下的@font face规则
2017年03月30日 by 阅读 69183 次, 今日 8 次CSS font-family常见中文字体对应的英文名称
2017年03月25日 by 阅读 114606 次, 今日 33 次虽然一些常见中文字体直接使用中文名称作为CSS font-family的属性值也能生效，但我们一般都不使用中文名称，而是使用英文名称，主要是规避乱码的风险。还有一些中文字体，直接使用中文名称作为CSS font-family的属性值是没有效果的，需要使用对应的英文字体名称才可以。也即是说，不管怎样，你要想使用中文字体，就必须要知道其对应的英文名称…
canvas 2D炫酷动效的实现套路和需要的技术积累
2017年03月18日 by 阅读 54094 次, 今日 2 次目前在web领域，基本上看到那些酷酷的2d动效，都是canvas实现的，flash已经基本上都被淘汰了，canvas效果的实现，无需安装任何插件，IE9及其以上浏览器支持，至少在移动端，大家可以放心大胆使用，甚至webGL 3D效果都可以尝鲜。
无论是雪花飘，星星动还是粒子飞，其canvas实现都是一样的套路…
【翻译】借助SVG实现背景透明JPG图片
2017年03月9日 by 阅读 45993 次, 今日 8 次人物往往色彩丰富，有时候会遇到需要背景透明的场景，结果PNG24图片尺寸太大，PNG8质量太差，JPG尺寸最小效果还好，但是背景又不透明，有没有什么办法就有JPG的小尺寸好效果，同时背景透明呢？本文的处理技巧可能会对你解决相关问题提供一些思路。
使用CSS offset-path让元素沿着不规则路径运动
2017年03月5日 by 阅读 59981 次, 今日 9 次在web端，要让一个元素按照特定的路径运动，在之前，基本上只能借助于SVG SMIL animation来实现，但是，随着浏览器的发展，CSS代码也能实现这样的功能，本文就将介绍如何使用CSS中的offset-path属性让元素沿着不规则路径运动。有demo有截图还有gif演示，总之，希望本文的内容能够对您的学习有所帮助。
了解CSS属性font-kerning,font-smoothing,font-variant
2017年02月23日 by 阅读 35522 次, 今日 5 次本文很简单，了解几个可能平时用得不太多，长得不太熟的font相关的几个CSS属性，分别是：font-kerning, font-smoothing和font-variant。
“蝉原则”与CSS3随机多背景随机圆角等效果
2017年02月17日 by 阅读 39426 次, 今日 2 次在web设计或交互实现的时候，随机效果是非常常见的，比如说我们希望我们动画看上去运行的是更随机，则可以把动画分解为多个维度，例如水平移动，垂直移动以及旋转缩放等，然后不停的循环，然后很关键的一点就是每个维度动画循环的时间遵循“蝉原则”，这样最后实现动画效果就显得非常随机以及丰富等。
小tips: 页面链接跳转历史URL不记录的兼容处理
2017年02月15日 by 阅读 53198 次, 今日 5 次我们点击首页的“分类”进入分类页，然后分类页头部有个“男生”“女生”的频道切换，这两个都是直接的链接，如果就会带来这么一个问题，如果用户在“男生”“女生”的频道之间反复切换，则当我们点击左上角的返回按钮（如下图）的时候，就会发现点击很多次还是在“分类页”上，这其实是不符合用户预期的，正常的用户预期应该是点击左上角的返回按钮应该直接回到首页，而不是还在当前页过家家。
要实现思路并不难，就是“男生”“女生”频道切换的时候，URL地址不要进入历史URL记录堆栈，但如何实现同时保证各个浏览器都兼容是个问题，本文就将展示相关的实践，希望对大家的学习能够有所帮助。
基于CSS3 column多栏布局实现水平滑页翻页交互
2017年02月15日 by 阅读 61118 次, 今日 4 次column多栏布局和flex弹性布局基本上是同一时间段出现的，从兼容性来讲，column多栏布局一直以来更稳定更兼容，而flex弹性布局前前后后历经多个版本，直至现在有些移动设备支持依然不好，但是两者的命运却截然相反，column多栏布局鲜有人问津，而flex弹性布局则风生水起。面试的时候，就算面试者并未在实际项目中使用过flex弹性布局，也会时不时扯到这东西上来，好像不提flex布局就跟时代脱节一样，其实完全没有必要，每个CSS属性都有它的潜力和价值所在，挖掘其内在价值而不是单纯的被外在的那层表现困于庐山才是真正想要看到的。
而本文就是通过挖掘column多栏布局潜力实现了看上去很棘手的交互效果，这里特异分享给大家，希望能够对大家的学习有所帮助~
我的应用
我的应用