美文网首页
PC查看移动设备网页元素

PC查看移动设备网页元素

作者: Goorwl | 来源:发表于2017-08-28 16:47 被阅读0次

文档概述

做html开发时候,可能需要分析元素的坐标及其他性能,本地开发OK运行到Android上可能就会出现问题,本文档旨在教你怎么在电脑上调试网页元素。

准备工作

  • adb 环境
  • 测试机chrome浏览器(原生浏览器也可以)
  • chorme浏览器

使用adb进行端口转发:

adb forward tcp:9222 localabstract:chrome_devtools_remote

打开PC端chorme浏览器在地址栏输入:

about:inspect

显示界面如下,并且勾选:

001

测试方式

经过以上步骤,随后打开测试网页,点击上图最下面的inspect按钮,出现如下窗口:

003

之后鼠标经过dom节点,手机上对应的控件会高亮显示。

以上。

相关文章

  • PC查看移动设备网页元素

    文档概述 做html开发时候,可能需要分析元素的坐标及其他性能,本地开发OK运行到Android上可能就会出现问题...

  • 浅谈响应式

    前言 由于移动设备的增多,携带便利,人们在移动设备上浏览网页的时间不断增加,甚至要超过PC端。但是PC端的网页放到...

  • 视口

    提问: 如果是pc的网页如何在移动端进行显示? 历史: 最早期pc端没办法直接查看pc网页,乔布斯为了移动端能访问...

  • VUE判断当前设备是PC还是移动端

    实际开发工作中会经常遇到一个需求,就是判断当前登录网页的设备是PC还是移动,要求PC端和移动端显示的是不同的网页内...

  • 使用http-server在本地搭建一个HTTP服务器

    为了方便在其他设备上访问PC上的资源,比如查看一下写好的网页在移动设备上的显示效果;在局域网的多机器中共享文件等等...

  • 使用http-server在本地搭建一个HTTP服务器

    目的 为了方便在其他设备上访问PC上的资源,比如查看一下写好的网页在移动设备上的显示效果;在局域网的多机器中共享文...

  • 移动端页面开发

    视口 视口是移动设备上用来显示网页的区域,一般会比移动设备可视区域大,如果是为了显示整个为了为PC端设计的网页,那...

  • 2-移动端适配问题

    解决网页在移动端的适配问题,一般的思路是通过查询设备的屏幕大小,自动对元素进行等比缩放,如果是PC端的适配问题就是...

  • 08-移动端

    移动端与PC端页面布局区别 视口视口是移动设备上用来显示网页的区域,一般会比移动设备可视区域大,宽度可能是980p...

  • 移动端布局

    从pc端到移动端, 布局上最大的改变就是要兼容不同大小的设备。 pc端虽然针对不同的屏幕大小,我们常用固定网页宽度...

网友评论

      本文标题:PC查看移动设备网页元素

      本文链接:https://www.haomeiwen.com/subject/bcygdxtx.html