电脑上如何查看h5响应式网站在手机下的效果

响应式，html5，微官网这些词语相信不少人在这两年里看到了很多，由于这几年这些确实是实在的火了一把，从切图网近两年承接的项目数据来看，html5手机端以及响应式项目也已经超越pc项目数量。随着手机终端的使用增多，为移动互联网的推动提供了硬件基础，不少人开始在移动互联网下掘金，而移动互联网掘金与传统互联网不一样的最大地方在于，这个时候，你不单单是有一个网站这么简单，这个网站还须要在pc，手机，平板下都可以很是的好看。

若是你已经有一个响应式网站，那么如何测试在手机下的效果呢，用手机直接打开测试固然能够，当时让你要测试比较多款的手机，那么这个方法显然是行不通的。因此咱们须要了解响应式的原理，才采用一些有效的方法来测试。响应式网站会响应的最新核心技术原理是，经过css3多媒体查询技术（css3 media query）来定义不一样宽度下的样式。例如

因此它的实际原理是根据设备的宽度来呈现不一样的样式，在pc上，咱们只须要简单的拖动浏览器窗口的大小就能够看到响应式的变化。在实际响应式开发中，咱们用的工具是firebug，或者chrome插件，若是非开发者，目前也有一些用于测试的在线网站例如跨屏测 ，能够方便你来测试，而它们的实现原理也均是采用控制浏览器宽度这个原理实现的。