如题，如何用PC机上的Chrome浏览器模拟查看和调试手机HTML5页面？

参考操作步骤如下：

第一步、用Chrome打开要调试的页面；

第二步、按F12，打开“开发者工具”，点击其右上角的“Dock to main window.”按钮，让“开发者工具”停靠在浏览器的“右边”，再点击左上角的“Toggle device mode.”按钮，如下图所示：

第三步、选择要模拟的设备，如下图所示：

第四步、刷新页面（很多人都死在这一步，你不刷新一下，是看不到效果的！）

在PC机上，如何用Chrome浏览器模拟查看和调试手机的HTML5页面？的更多相关文章

  1. Chrome浏览器内嵌的各种手机模拟器

    打开chrome的控制台标签,然后,点击simulator子标签页,选择需要的手机即可,如下图: 模拟器如下: 阅读原文:Chrome浏览器内嵌的各种手机模拟器

  2. 【web】Chrome 浏览器中查看 webSocket 连接信息

    1.以下代码实现一个webSocket连接,在文本输入框中输入内容,点击发送,通过服务器,返回相同的内容显示在下方. 1 <!DOCTYPE html> 2 <html lang=& ...

  3. chrome浏览器 模拟访问移动端

    谷歌Chrome浏览器,可以很方便地用来当3G手机模拟器.在Windows的[开始]-->[运行]中输入以下命令,启动谷歌浏览器,即可模拟相应手机的浏览器去访问3G手机网页: 谷歌Android ...

  4. 用Chrome浏览器模拟手机,android,iphone,ipad访问网站

    很多网站都通过User-Agent来判断浏览器类型,如果是3G手机,显示手机页面内容,如果是普通浏览器,显示普通网页内容.谷歌Chrome浏览 器,可以很方便地用来当3G手机模拟器.在Windows的 ...

  5. 如何用Chrome浏览器下载网页音乐视频

    打开网页,先让要下载的视频播放,右键单击选择审查元素(F12),选择上方的Network选项,按F5刷新,这个时候我们可以看到框架中Size下的不少文件数据数字正在变大,按size降序排列.点击表格的 ...

  6. （原创）如何使用selenium 驱动chrome浏览器并且打开方式为手机模式-转载请注明出处

    随着移动设备使用率的不断增加,移动页面的测试也变得越来越重要. 对于互联网公司M站的测试,如果不通过专用的appium等移动端测试工具是否还有方便快捷的办法呢?答案当然是有啊. 使用chrome dr ...

  7. chrome浏览器插件window resizer调试webapp页面大小

    chrome浏览器插件window resizer可以调整当前浏览器分辨率大小 可以自定义大小,以适合于andorid和iphone设备

  8. Win7系统Chrome浏览器缓存查看技巧介绍（转）

    1.Chrome下提供了一个命令chrome://cache,可以查看到保留下来的缓存; 2.但是,当你点击缓存文件,Chrome却并非打开缓存源文件,而是如图所示的二进制编码文件; 3.在Win7系 ...

  9. Chrome浏览器缓存查看工具－ChromeCacheView

    最近想听一下最新的流行热歌,按着某网站的新歌排行榜逐首在巨鲸音乐网搜索下载,但相当一部分的歌曲还是没能下载到,逼不得已只能到百度MP3下载,在搜索结果中已经挑体积比较大的文件来下载了,但下载到的MP3 ...

随机推荐

  1. 完美兼容IE,chrome,ff的设为首页、加入收藏及保存到桌面js代码

    <script  type="text/javascript"> //设为首页 function SetHome(obj,url){     try{         ...

  2. Python基础(7)闭包函数、装饰器

    一.闭包函数 闭包函数:1.函数内部定义函数,成为内部函数, 2.改内部函数包含对外部作用域,而不是对全局作用域名字的引用 那么该内部函数成为闭包函数 #最简单的无参闭包函数 def func1() ...

  3. loj6087 毒瘤题

    传送门:https://loj.ac/problem/6087 [题解] 这垃圾题目卡空间啊... k=1相信大家都会,把所有数异或起来就是答案了. 考虑k=2,把所有数异或起来得到两个答案数的异或值 ...

  4. 不谈OI：高二（13）最后一次班班有歌声

    最后一次班班有歌声了…… 自己因为搞oi并没有参加,只是决赛的时候幕后放了放背景视频…… 不管怎么说,我们班唱的很棒啊,全部人都很棒! 说真的我为我们班骄傲 视频: https://v.qq.com/ ...

  5. [ZOJ2341]Reactor Cooling解题报告|带上下界的网络流|无源汇的可行流

    Reactor Cooling The terrorist group leaded by a well known international terrorist Ben Bladen is bul ...

  6. 归档普通对象Demo示例程序源代码

    源代码下载链接:06-归档普通对象.zip34.2 KB // MJPerson.h // //  MJPerson.h //  06-归档普通对象 // //  Created by apple o ...

  7. [bzoj2049][Sdoi2008]Cave 洞穴勘测——lct

    Brief Description 给定一个森林,您需要支持两种操作: 链接两个节点. 断开两个节点之间的链接. Algorithm Design 对于树上的操作,我们现在已经有了树链剖分可以处理这些 ...

  8. 【bzoj3289】mato的文件管理

    首先允许离线,一眼莫队…… 然后考虑对于每次移动,这不就是让你求逆序对嘛(QAQ) 考虑怎么移动? 每次在最后添加一个数,比这个数大的数都会与其形成一个逆序对 每次在最后移除一个数,比这个数大的数都会 ...

  9. python 多进程锁Lock和共享内存

    多进程锁 lock = multiprocessing.Lock() 创建一个锁 lock.acquire() 获取锁 lock.release() 释放锁 with lock: 自动获取.释放锁 类 ...

  10. JavaScript的for循环语句

    语法格式 for(初始化值;循环的条件;每一次循环的递增值){ // 循环的条件结果为true,则执行循环体中的代码 } 示例(打印出1-10之间的整数): for(var a=1;a<=10; ...