新开发的网页需要在手机或是模拟机上运行测试,如果手头事件比加紧,那么可以借助 Chrome提供的手机网页预览程序进行简单调试。查看 制作的网页是否能够适合各种手机型号使用。

下面所以下如何使用Chrome调试多类型手机网页。

首先 下载Chrome 浏览器。

在你要调试的网页或是本地页面中。按F12 打开调试器。

工具/原料

  • Chrome浏览器

方法/步骤

  1.  

    打开 仿真面板。如图所示:

  2.  

    可以在 Device 选择设备。

    可以在Screen  设置模拟的屏幕方面的东西,设置分辨率,屏幕尺寸。

    可以在 User Agent 设置 客户端Agent

    可以在 sensors  设置感应等,模拟触屏操作。

  3.  

    配置好之后,点击 Emulate 。开始进行仿真。

    (选择Device需要点击emulate)其余选项是在修改后自动改变。

  4. 4

    如何假设 平板旋转屏幕?

    可以在 screen中,点击分辨率中间的互换按钮就可以了。

    使用Chrome浏览器调试,配置好调试设置之后,可以自由输入 网址查看 在移动设备上的现实情况。

    END

注意事项

  • 如果不出现菜单,下载最新版Chrome浏览器插件。

Chrome调试手机页面的更多相关文章

  1. 通过chrome浏览器调试手机页面(IOS和Android)

    开发PC页面的时候使用chrome浏览器的开发者工具,可以很容易的捕获到页面的dom元素,并且可以修改样式,方便调试,但是手机上却很麻烦,因为手机上没有办法直接打开开发者工具查看元素.其实可以通过将设 ...

  2. 使用fiddler4做代理调试手机页面

    由于一般手机不能改host,手机页面如果涉及到各个域名ip的混合使用,在手机上调试看效果非常麻烦. 使用fiddler4做代理,手机跟电脑连到同一个局域网,手机上网通过电脑做个代理上网,那么一切请求就 ...

  3. 【前端调试手机页面】分享一款便捷的调试工具--spy-debugger

    spy-debugger  :  微信调试,各种WebView样式调试.手机浏览器的页面真机调试.便捷的远程调试手机页面.抓包工具,支持:HTTP/HTTPS,无需USB连接设备. github地址: ...

  4. UC浏览器开发者版调试手机页面

    1 关于RI 目前,在手机上使用浏览器访问网页,无法便捷地进行网页语言调试.手机屏幕相对较小且操作不便,直接在手机上进行网页数据调试不太现实. 因此,我们使用技术将手机网页调试信息分离,实现一种能在大 ...

  5. Weinre(pc调试手机页面)

         Weinre是一款基于Web Inspector(Webkit)的远程调试工具,借助于网络,可以在PC上直接调试运行在移动设备上的远程页面,中文意思是远程Web检查器,有了Weinre,在P ...

  6. 使用weinre调试手机页面

    阅读目录 介绍Weinre 安装Weinre 通过Weinre调试页面 启动target 介绍Weinre Weinre(Web Inspector Remote),是一种远程调试工具.功能与Fire ...

  7. chrome调试手机webview中页面

    http://blog.csdn.net/freshlover/article/details/42528643 注: 1. 可以调试真机上页面(USB连接)和虚拟机上页面 2. 手机系统需要4.4+ ...

  8. 利用chrome调试手机网页

    1.pc端安装最新的chrome 2.手机端安装最新的chrome ( Android机 )ms不需要 3.USB连接线 4.打开电脑的chrome 在地址栏输入 chrome://inspect

  9. APICloud和海马玩模拟器结合调试手机页面

    https://blog.csdn.net/pleasecallme_522/article/details/54577904

随机推荐

  1. 使用redis构建可靠分布式锁

    关于分布式锁的概念,具体实现方式,直接参阅下面两个帖子,这里就不多介绍了. 分布式锁的多种实现方式 分布式锁总结 对于分布式锁的几种实现方式的优劣,这里再列举下 1. 数据库实现方式 优点:易理解 缺 ...

  2. Java 征途:行者的地图

    前段时间应因缘梳理了下自己的 Java 知识体系, 成文一篇望能帮到即将走进或正在 Java 世界跋涉的程序员们. 第一张,基础图 大约在 2003 年我开始知道 Java 的(当时还在用 Delph ...

  3. C++ 11 多线程--线程管理

    说到多线程编程,那么就不得不提并行和并发,多线程是实现并发(并行)的一种手段.并行是指两个或多个独立的操作同时进行.注意这里是同时进行,区别于并发,在一个时间段内执行多个操作.在单核时代,多个线程是并 ...

  4. C# 索引器,实现IEnumerable接口的GetEnumerator()方法

    当自定义类需要实现索引时,可以在类中实现索引器. 用Table作为例子,Table由多个Row组成,Row由多个Cell组成, 我们需要实现自定义的table[0],row[0] 索引器定义格式为 [ ...

  5. Android 在Android代码中执行命令行

    1.路径最好不要是自己拼写的路径/mnt/shell/emulated/0/wifidog.conf 最好是通过方法获取的路径,不然可能导致命令无效  (挂载点的原因) public static f ...

  6. android SystemServer.java启动的服务。

    EntropyService:熵(shang)服务,用于产生随机数PowerManagerService:电源管理服务ActivityManagerService:最核心服务之一,Activity管理 ...

  7. MongoDB学习笔记~对集合属性的操作

    回到目录 $unset清除元素 请注意在单个数组元素上使用$unset的结果可能与你设想的不一样.其结果只是将元素的值设置为null,而非删除整个元素.要想彻底删除某个数组元素,可以用$pull 和$ ...

  8. 【repost】JS错误类型的学习

    SyntaxError是解析代码时发生的语法错误 // 变量名错误  var 1a;  // 缺少括号  console.log 'hello'); (2)ReferenceError Referen ...

  9. node应用线上部署时锁定包的依赖版本

    npm shrinkwrap 我们使用node开发时,经常需要依赖一些模块来完成功能需求,而我们所依赖的模块也必然会依赖其他模块,就这样一级一级的依赖,而且这些依赖模块并不为我们所控制.一个产品或项目 ...

  10. ASP.NET MVC Model绑定(二)

    ASP.NET MVC Model绑定(二) 前言 上篇对于Model绑定的简单演示想必大家对Model绑定的使用方式有一点的了解,那大家有没有想过Model绑定器是在什么时候执行的?又或是执行的过程 ...