【技术分享会】 @第三期 CSS框架 PRUE 实现自适应和响应式

Pure网址：https://purecss.cn/

什么是响应式和自适应？

、响应式：样式会随着屏幕大小改变，同一页面设备不同样式不同
、自适应：不管屏幕大小，页面的样式比例不变

响应式和自适应怎么布局？

在css3之前无从谈起响应式和自适应
Css3怎么做到的呢？(我知道的几种)
、媒体查询
、运用百分比布局
、rem
、css框架（Bootstrap、jQuery Mobile、Pure……）

、媒体查询
      @media all and (屏幕宽度){
                                样式表
                              }
、运用百分比布局
       width：%；
、rem
       body{font-size：%；}
、css框架（Bootstrap、jQuery Mobile、Pure……）
        具体谈论下pure

Pure：纯净的，干净的。
Pure是来自雅虎的。
尽管从UI界面效果上来说，Pure没有Bootstrap那样精美，
但Pure是纯CSS实现的，因此非常小巧，整个框架压缩后只有5.7k左右（保守的）。

Pure特点：

、最大的特点就是框架基于纯CSS，无任何JavaScript代码，
   渲染速度比较快。
、由Yahoo出品，技术上应该不存在太大问题。
、框架十分小巧，压缩后仅5.7k。
、组件也很丰富，包括表格、表单、按钮、导航等。
、CSS类的标识十分简单，因此在使用Pure的过程中代码会比较友好。
、只提供布局，没有多余的样式阻碍

PPT资料

http://pan.baidu.com/s/1qYMzIxe