码迷,mamicode.com
首页 > Web开发 > 详细

【CSS框架】PRUE实现自适应和响应式

时间:2017-03-03 09:59:37      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:http   div   样式   表格   最大   trap   idt   pre   按钮   

 

什么是响应式和自适应?

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

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

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

 

1、媒体查询
      @media all and (屏幕宽度){
                                样式表
                              }
2、运用百分比布局
       width:100%3、rem
       body{font-size:62%;}
4、css框架(Bootstrap、jQuery Mobile、Pure……)
        具体谈论下pure

 

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

 

Pure特点:

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

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

 

【CSS框架】PRUE实现自适应和响应式

标签:http   div   样式   表格   最大   trap   idt   pre   按钮   

原文地址:http://www.cnblogs.com/jhli/p/6494559.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!