View demo Download source 紧接着Lucas Bebber在 最近的web实验 中对图片和文字制造的逼真热辐射和水波效果，我们想分享一下这类效果在按钮上的灵感。在HTML元素上使用SVG滤镜能让我们有更大的机会实现创造性的点击互动，这正是我们今天所要探索的内容。 主

HTML 语义 HTML5为我们提供了很多旨在精确描述内容的语义元素。确保你可以从它丰富的词汇中获益。 !--bad--divid=maindivclass=articledivclass=headerh1Blogpost/h1pPublished:span21stFeb,2015/span/p/divp…/p/div/div!--good--mainarticleheaderh1Blogpo

Simple Grid 是一款响应式、轻量级的网格系统，1140PX的宽度包含12列，但是很容易适配各种尺寸的排版。 使用网格进行网页设计已经是潮流，但是现在有很多 CSS 框架都提供网格功能，用来控制网页上每个元素的位置，但是这些 CSS 框架都是太多功能，而有时我们

想要达到平滑的动画效果，浏览器需要避免复杂繁琐的工作，比如解析代码，构建渲染树，绘制，布局等等工作。庆幸的是，我们有GPU。 从一个简单例子说起。 假设现在有这样的需求，鼠标移上图标时，图片向右移动300个像素单位，效果大概是下面这样。 很自然，人

如何实现SVG线动画 我相信你肯定已经看过很多SVG绘制路线的动画。非常酷对吧？这篇文章简单介绍如何实现动画，如果你有兴趣，可以看文章下方的扩展阅读。 效果如下，后面会附上CodePen。 不罗嗦，直接进入正题。 绘制路径 首先你需要绘制SVG路径，使用的工具

前言 前后端分离已经是业界所共识的一种开发/部署模式了。所谓的前后端分离，并 不是 传统行业中的按部门划分，一部分人纯做前端（HTML/CSS/JavaScript/Flex），另一部分人纯做后端，因为这种方式是 不工作 的：比如很多团队采取了后端的模板技术（JSP, Free

转载自 http://www.imooc.com/wenda/detail/256528 其中daemonite可以直接在github上下载，用firefox或者chrome打开index.html就可以看到效果了，简直是惊艳。 9个目前流行的Material Design前端框架 谷歌推出的Material Design风格已见有一些APP UI采用，视

原文 http://www.ruanyifeng.com/blog/2015/02/future-of-dom.html 有一个词手机网站（mobile web），指供手机浏览的网站，但它是不存在的。 人们提到移动互联网的时候，其实专指另外一样东西：手机App。 一、Web App vs. Native App 比起手机App，网站有一

移动 Web 之争 我们并不想讨论 Flipboard 和其他一些公司「政治正确」的观点，我们只考虑「工作效率」这回事。事实证明，开发混合模式应用是最有效的方法，一直以来都是如此。 而事实是，当我们谈论 Native App 时，其实我们说的已经是 Hybrid App 了，因为