如何模拟测试不同分辨率设备网页

多数浏览器都支持按住ctrl键，然后滑动鼠标滚轮进行页面的缩放，这里例举网页开发中常用的两款浏览器Chrome和Firefox

在浏览器中调节网页分辨率

1.chrome

测试不同分辨率下网页的兼容性

1

利用Chrome的开发者工具进行网页分辨率兼容性调试，F12进入开发者模式，看图说话

2

利用Firefox的开发者工具进行网页分辨率兼容性调试，F12进入开发者模式，看图说话

3

用testsize.com调试在线网站不同分辨率下的效果
注意只能调试上线的网页
网址http://testsize.com/

4.chrome的插件Resolution Test

缩放排列布局的原因

这与你电脑分辨率及浏览器无关，有些网页可以自适应设备，也就是不管什么分辨率的设备都可以满屏展示，而且样式和布局会随着设备分辨率的大小变化而变化，这是因为其用到了响应式技术，关键点即不用绝对大小，取而代之的是相对大小，比如style=“width:100%;height:100%”