• UID12
  • 登录2016-06-14
  • 粉丝112
  • 关注50
  • 发帖1415
  • 主页
  • 金币8548枚
社区居民
最爱沙发
忠实会员
喜欢达人
原创写手
极分享 发布于2015-09-01 13:31
1/5269

18个最好的响应式Web设计工具和库

楼层直达
现在在网上,响应式Web设计的工具和库资源玲珑满目,应有尽有。下面我将讲一讲其中最好的18个工具和库。

1)Get
Bootstrap

如果你想用HTML、CSS和JavaScript开发响应式网页,Bootstrap是最受网页设计师和开发人员欢迎的框架。它适合所有技能水平的人,不管你的项目规模如何。
官方网站:http://getbootstrap.com/

2)Ink
Ink提供了一个响应式的电子邮件框架,可以帮助你创建适用于任何设备、可在任何地方阅读的响应式HTML电子邮件。
官方网站:http://zurb.com/ink/

3)Susy
官方网站:http://susy.oddbird.net/

4)Simplegrid
在创建网站时,编写支持网格的代码是难点之一。这就是为什么SG尽可能地使用了最少的标记和类以保持事情的简单明了。甚至是嵌套网格槽也不需要额外的类。
官方网站:http://simplegrid.info/

5)Furatto
Furatto既轻巧又简单易用,可用于前端程序设计和开发响应式网页。在小型设备上隐藏一些事情对于改善用户体验是很重要的。Furatto提供类名来隐藏或显示元素。
官方网站:http://icalialabs.github.io/furatto/

6)Lessframework
Lessframework是一款支持设计自适应网站的CSS网格系统。它含有通通基于单网格的4款布局和3套预设排版。
官方网站:http://lessframework.com/

7)Getskeleton
如果你要做的只是一个小项目或者你觉得你并不需要大型的框架,那么不妨选择Skeleton。Skeleton的标准HTML元素设计样式屈指可数,网格也只有一个,不过这能让我们更加轻松上手。
官方网站:http://getskeleton.com/

8)Restivejs
Restive.JS是一个jQuery插件,可以帮助我们轻松快捷地将功能添加至网站,使其能够响应和适应几乎所有的Web功能设备。
官方网站:http://restivejs.com/

9)Fittextjs
FitText能让你灵活操作字体大小。
官方网站:http://fittextjs.com/

10)Onepage Scroll
这是一款能实现苹果风格的滚动插件。
官方网站:http://www.thepetedesign.com/demos/onepage_scroll_demo.html

11)Glide
Glide是反应灵敏、触摸友好的jQuery滑块。它简单,轻巧,快速。作为一个滑块,它设计得恰到好处。
官方网站:http://glide.jedrzejchalubek.com/

12)ResponsiveSlides
ResponsiveSlides.js是一个很小的jQuery插件,用于创建在容器内使用元素的响应式滑块。ResponsiveSLides.js适用于多种浏览器,包括IE6和6以上的所有版本。
官方网站:http://responsiveslides.com/

13)PhotoSwipe
PhotoSwipe是专为移动触摸设备设计的JavaScript画廊,支持所有基本的手势操作。
官方网站:http://photoswipe.com/

14)Magnific Popup
Magnific Popup是一款注重性能的响应式lightbox和dialog脚本,在任何设备(支持jQuery和Zepto.js)上都能为用户提供最佳体验。
官方网站:http://dimsemenov.com/plugins/magnific-popup/

15)Justified.js
Justified.js是一个用来为已有图片创建自适应图片网格的JQuery插件。填充所有空余的地方!这样,实际上是创造了一个包含不同尺寸图片的优雅画册,同一行的所有图片都是同样的高度。
官方网站:http://nitinhayaran.github.io/Justified.js/demo/index.html

16)Sidr
支持创建侧菜单和用最简单的方法制作响应式菜单的最佳jQuery插件。
官方网站:http://www.berriart.com/sidr/

17)BigSlide.js
bigSlide是一个极小极小(压缩后大概1KB)的jQuery插件,用于创建脱屏滑盖面板的导航。
官方网站:http://ascott1.github.io/bigSlide.js/

18)Am I Responsive Design
这个工具可以让我们迅速得到所需要的内容,并且它能帮助你更直观地呈现给客户你所描述的响应式设计的内涵,特别是当这个产品还没有准备好的时候。
官方网站:http://ami.responsivedesign.is/



译文链接:http://www.codeceo.com/article/18-best-web-design-tools.html
英文原文:18 Best Tools and Libraries for Responsive Web Designs




0人打赏
  • UID2783
  • 登录2016-11-24
  • 粉丝0
  • 关注0
  • 发帖5
  • 主页
  • 金币17枚
社区居民
梦醒o夜微凉 发布于2016-01-07 18:06
沙发F
这么多框架,有时间可以好好玩玩
您需要登录后才可以回帖
发表回复
极贡献
技术问答
专题荟萃
程序人生
视觉设计
Android开发
iOS开发
编程语言
前端开发
后端开发
服务器架构
软件测试
运维方案
创业路上



最热文章墙

  • 77037/375   【精品推荐】200多种Android动画效果的强悍框架,太全了,不看这个,再有动画的问题,不理你了^@^

  • 44087/191   情人节福利,程序员表白的正确姿势:改几行代码就变成自己的表白了

  • 43710/0   Python爬虫:常用浏览器的useragent

  • 40229/259   【精品推荐】Android版产品级的音乐播放器源码,功能太强大了,最好的产品原型有木有?

  • 37959/145   省时省力的Android组件群来了,非常棒的原型参考

  • 29226/142   2016抢红包软件及源码

  • 28978/2   超全!整理常用的iOS第三方资源

  • 28850/71   原创表白APP,以程序员的姿势备战新年后的7夕,持续完善中!

  • 23573/159   Android版类似UC浏览器:非常赞,产品级的源码

  • 22589/30   麻省理工的一帮疯子,真的实现了随意操控万物!(绝对黑科技)

  • 22273/25   Android工程师面试题大全

  • 22148/27   2016程序员跳槽全攻略

  • 21740/9   GitHub上排名前50的iOS项目:总有一款你用得着

  • 20703/20   码魂:程序员的牛B漫画

  • 18795/10   2016年最全的Android面试考题+答案 精编版

  • 18647/85   Android小而全的博客源码:非常适合全面掌握开发技巧

  • 18530/3   吐槽那些程序员的搞笑牛逼注释

  • 18524/42   一个绚丽的loading动效分析与实现!

  • 18504/73   【持续更新中】Android福利贴(二):资料源码大放送

  • 17454/1   iOS 动画总结

  • 17302/45   惊艳的App引导页:背景图片切换加各个页面动画效果

  • 17103/81   仿京东商城客户端Android最新版,不错的原型和学习资料

  • 16930/104   Android带弹幕的视频播放器源码,来自大名鼎鼎的Bilibili弹幕网站

  • 16842/23   个人收集的Android 各类功能源代码

  • 16330/5   新一代Android渠道打包工具:1000个渠道包只需要5秒

  • 16249/10   女程序员的梦,众网友的神回复

  • 16242/21   Android福利第三波【Android电子书】

  • 16111/53   基于瀑布流的美女图片浏览App,有注释的源代码

  • 16086/17   用JavaScript 来开发iOS和Android 原生应用:React Native开源框架中文版来啦

  • 16005/81   【精品推荐】类似360安全卫士安Android源码:非常赞的产品原型

  • 15939/11   年会上现场review代码是怎么样的体验!

  • 15750/23   珍藏多年的素材,灵感搜寻网站

  • 15748/0   iOS中文版资源库,非常全

  • 15048/18   65条最常用正则表达式,你要的都在这里了

  • 14575/15   基于Android支付宝支付设计和开发方案

  • 13999/17   什么是真正的黑客:收获12200+Stars,人气远超微软开源VS

  • 13972/11   有木有这样一张酷图帮你集齐所有git命令超实用

  • 13658/46   在线音乐播放器完整版(商用级的源码):非常赞,可听免费高品质专辑

  • 13483/0   GitHub iOS 库和框架Top100 

  • 13333/7   一张图搞定iOS学习路线,非常全面

  • 13326/7   用程序员的姿势抢过年的火车票

  • 13202/61   【技巧一】搭配Android Studio,如何实现App远程真机debug?

  • 12958/10   成为Java顶尖程序员 ,看这11本书就够了

  • 12877/10   微信支付终于成功了(安卓,iOS),在此分享

  • 12801/18   一张图搞定Android学习路线,非常全面

  • 12542/29   【持续更新中】Android福利贴(一):资料源码

  • 12477/3   基于Node.js的强大爬虫,能直接发布抓取的文章哦

  • 12188/4   46 个非常有用的 PHP 代码片段

  • 11744/3   即时通信第三方库

  • 11257/8   流媒体视频直播方案

  • 11172/18   八个最优秀的Android Studio插件

  • 11054/9   B站建开源工作组:APP想支持炫酷弹幕的看过来

  • 10884/9   烧了5亿美金,这家神秘的公司即将颠覆人类未来!

  • 10785/2   【精品推荐】高质量PHP代码的50个实用技巧:非常值得收藏

  • 10696/10   中国黑客的隐秘江湖:攻守对立,顶尖高手月入千万美元

  • 10059/6   开箱即用!Android四款系统架构工具

  • 9878/10   十大技巧快速提升Android应用开发性能

  • 9799/3   10款GitHub上最火爆的国产开源项目——可以媲美西半球

  • 9698/1   Android性能优化视频,文档以及工具

  • 9660/3   一张图看清Linux 内核运行原理

  • 返回顶部