adapt.js 最初是切图网方便内部开发弄的一款响应式开发插件，可以简化你的响应式工作，支持4种常规分辨率响应，hd、desktop、flatbed、phone 。
常规写法：
@media(min-width:1250px) and (max-width:1921px) {
body{ background:red;} /*宽屏下背景是红色*/
}
@media(min-width:980px) and (max-width:1300px) {
body{ background:blue;} /*普屏下背景是蓝色*/
}
@media(min-width:768px) and (max-width:960px) {
body{ background:green;} /*平板下背景是绿色*/
}
@media(max-width:768px){
body{ background:gray;} /*手机下背景是灰色*/
}并且如果使用 adapt.js的话，可以无需写繁琐的css3多媒体查询代码。
引用方式
<!--依赖jQuery文件--> <script src="js/jquery-1.3.2.min.js"></script> <!--adapt.js核心文件--> <script src="js/adapt.js"></script>
adapt.js写法：
.hd body{ background:red;} /*宽屏下背景是红色*/
.desktop body{ background:blue;} /*普屏下背景是蓝色*/
.flatbed body{ background:green;} /*平板下背景是绿色*/
.phone body{ background:gray;} /*手机下背景是灰色*/adapt.js其他妙用（针对不同浏览器调整兼容性）：
html.ie6 body{ background:red; }
html.ie7 body{ background:blue; }
html.ie8 body{ background:#000; }
html.firefox body{ background:#111; }
html.chrome body{ background:#222; }
html.safari body{ background:#333; }效果演示
http://adapt.slicy.cn
（拖拽浏览器宽度，可以查看小圆点颜色变化）