MDL---Material Design Lite框架推荐

INTRO

material design相比不会陌生, 如今的移动端基本遵循了这个设计规范, 微软退出过一个残次品universal design(花了半个月时间赶出来的规范)也是借鉴了MD的思想, 官网以下:

getmdl.io -vanilla CSS，HTML和JS中的组件和模板库

 

早在2014年，Google就发布了material design 规范，目标是为全部设备外形提供良好设计和精美UI的指南。谷歌本身固然也推出了符合这一规范的前端web框架爱: Material Design Lite（MDL）。

MDL能够轻松地为您的网站添加材料设计外观。MDL的“Lite”部分来自几个关键设计目标：MDL具备不多的依赖性，使其易于安装和使用。它与框架无关，这意味着MDL能够与任何快速变化的前端工具链环境一块儿使用。MDL在代码大小方面的开销很低（约27KB gzip），并且关注点很窄 - 为网站提供了材料设计样式。

 

MDL是使用Polymer构建的Paper元素的补充实现。Paper元素是彻底封装的组件，能够单独使用或组合在一块儿以建立材料设计风格的站点，并支持更高级的用户交互。也就是说，MDL能够与Polymer元素对应物一块儿使用。

和其余UI框架同样, 它是开箱即用的模板

MDL针对内容很重的网站进行优化，例如营销页面，文本文章和博客。咱们构建了响应式模板，以显示可使用MDL建立的站点范围。这些能激发您构建外观漂亮的网站。

DEMO

博客：

内容网站：

管理系统：

独立文章：

 

ABOUT

对MD的实现有无数种, 在web领域就有数十种开源框架基于material来实现的, 国内有一个MDUI的框架我的认为对md的实现很是完美, 同时在兼容性上超越了MDL, 能够尝试一下:

https://www.mdui.org/

技术细节和浏览器支持

MDL包含丰富的组件，包括材料设计按钮，文本字段，工具提示，微调器等等。它还包括响应网格和断点.

 

完整的MDL体验适用于全部现代常青浏览器（Chrome，Firefox，Opera，Microsoft Edge）和Safari.

其余

MDL的核心是Lite, 即精简, 比mdui要小不少,也快不少, 可是缺点是不少地方须要polyfill来兼容, 甚至是firefox.

谷歌一直在与设计师合做，不断发展材料设计，为网络构建额外的思惟。这包括处理响应式模板，高性能排版和徽章等缺失组件的解决方案。

 

MDL创建在您已经知道并天天使用的Web核心技术的基础上 - CSS，HTML和JS。经过在项目中采用MDL，您能够访问权威且高度策划的Web材料设计实现。

我火烧眉毛地想要使用MDL来构建的美丽，现代，响应迅速的blog网站: 欢迎关注我用mdl实现的的我的主页;

jinhengyu.github.io