超级实用的响应式网站设计工具汇总（二）-控件新闻-慧都网

超级实用的响应式网站设计工具汇总（二）

原创|行业资讯|编辑：龚雪|2014-03-06 10:38:20.000|阅读 533 次

概述：如何将你的网站布局为响应式的设计，为你的网站体验大大加分呢？上文为你汇总了很多实用的响应式框架和流体网格工具，下面我们再来看看线框图类、JavaScript/JQuery插件类以及图像和文字工具类的响应式工具。

三、线框图类

1. Responsive Web Design Sketch Sheets

Responsive Web Design Sketch Sheets可以帮助你实时看到网站在不同分辨率下的显示情况。Responsive Web Design Sketch Sheets的使用也非常简单，只需下载一个zip文件就可以用。

2. Responsive Wireframes

Responsive Wireframes可以用来查看你的响应式网站设计在不同的移动和桌面浏览器中的显示情况。

3. Style Tiles

Style Tiles使得设计师在设计一个可视化品牌的过程中可将设计的演变随时传递到网上，包括字体、颜色和界面元素等，与客户方实现设计与交付的平衡。

4. Multi-Device Design Prototype

Multi-Device Design Prototype为响应式网站设计提供多种流行的模式。

四、JavaScript/JQuery插件类

1. Adapt.Js

Adapt.Js是一个非常轻量级的JavaScript插件，可替换CSS媒体查询。

2. Isotope

Isotope是一个jQuery的插件，它可以使网页上的元素随着浏览器窗口大小的改变重新排列。

3. Masonry

Masonry是一个jQuery插件，可用于创建自适应的布局。与Isotope类似，Masonry也可以重新排列网页元素使其更好地适应不同窗口大小。

4. Respond.Js

Respond.Js是一款轻量级的jQuery插件，可以让你在浏览器（如IE）中启用响应式网页设计。

5. TinyNav.Js

TinyNav.Js是一个可将大的导航列表转换成小的下拉菜单式列表的jQuery的插件。

6. Wookmark JQuery Plugin

使用Wookmark JQuery Plugin，开发人员可以快速检测到浏览器和或窗口的大小，且该插件会自动将网页元素重新排列。

五、响应图像和文字工具类

1. Adaptive Images

如果你需要检测访问者的屏幕尺寸，以此创建一个分辨率最合适的网站，Adaptive Images可以完全满足你。

2. Seamless Responsive Photo Grid

Seamless Responsive Photo Grid可以让你的图像无缝呈现，避免图像与图像之间留有任何缝隙。

3. Picturefill

Picturefill是一种图像处理方式，可以将你的图像调整到允许分辨率之类的最佳像素。

4. Retina Images

Retina Images可以为你提供视网膜图像，使得图像在某些高分辨率显示器屏幕上观看时尺寸显示会大一倍。

5. FitText

FitText是专门的响应式文字处理插件，可将文本和标题响应任何终端设备。

>>相关阅读：

标签：网站设计

本站文章除注明转载外，均为本站原创或翻译。欢迎任何形式的转载，但请务必注明出处、不得修改原文相关链接，如果存在内容上的异议请邮件反馈至chenjj@evget.com

文章转载自：慧都控件网

上一篇：成为优秀的Web移动开发者：编程资源大全下一篇：简化代码，不走弯路——走近开源UI应用开发框架Qt

在线采购

中文文档库

试用/Demo下载

开发社群