ChromDevTools

1、如何打开DevTools。

  • 在Chrome菜单中选择 更多工具 > 开发者工具
  • 在页面元素上右键点击,选择 “检查”
  • 使用 快捷键 F12

2、切换 Device Mode 按钮可以打开或关闭 Device Mode。

  

3、使用视口控件

  

  

利用视口控件,您可以针对各种设备测试网站,以及是否能够实现完全自适应。它包括以下两个模式:

  1. 自适应。使视口可以通过任意一侧的大手柄随意调整大小。
  2. 特定设备。将视口锁定为特定设备确切的视口大小,并模拟特定设备特性。

4、设置网络环境

  

  

ChromDevTools的更多相关文章

  1. vscode 搭建react-native

    vscode 搭建react-native 选择:vscode + typings + eslint * vscode: 宇宙最强IDE家族的最新产品 * typings: 基于typescirpt的 ...

随机推荐

  1. MySQL----ERROR 1071 (42000): Specified key was too long; max key length is 767 bytes

    1.问题描述 在导入同事提供的一个sql文件时候,出现了一个1071错误,总结学习一下: 2.分析问题 错误的字面意思是说mysql字段设置的值太长了,不能大于767个字节,在网上找了一些资料后才知道 ...

  2. Docker的概述

    什么是Docker 1.容器技术 在计算机的世界中,容器拥有一段漫长且传奇的历史.容器与管理程序虚拟化(hypervisor virtualization,HV)有所不同,管理程序虚拟化通过中间层将一 ...

  3. webform(复合控件)

    一.组合单选 RadioButtonList 单选按钮与简单控件不同,可理解为在集合中放置多对象 例: <asp:RadioButtonList ID="RadioButtonList ...

  4. 【转】Jenkins 二次开发 - Python

    马克,备用: Jenkins 二次开发 https://testerhome.com/topics/14988?locale=zh-TW python-jenkins api 文档:https://p ...

  5. microsoft visual c++ 14.0 is required问题解决办法

    方法有两个: 1.绕过pip,手动下载包 2.升级vc 详情参考:https://blog.csdn.net/amoscn/article/details/78215641

  6. Office2019都有哪些强大功能

    前阵子是微软一年一度的Ignite大会.而其中最引人注目.也是与我们一般人最息息相关的消息,当然是Office 2019的正式发布. 尽管Office 2019所更新的功能,对于Office 365的 ...

  7. du 统计文件夹大小

    du -h --max-depth=1 |grep [TG] |sort   #查找上G和T的目录并排序 du -sh    #统计当前目录的大小,以直观方式展现 du -h --max-depth= ...

  8. php中显示数组与对象的实现代码

    1. 使用 print_r ( $array/$var ) print 是打印的意思,而r则取自Array的单词,那么该函数的功能就是打印数组内容,它既可以打印数组内容,也可以打印普通的变量. pri ...

  9. js 定义一个对象并且给对象赋值方法

    var  obj={}; obj.a="12"; obj.b="13" var o ={}; o.jsonObj=obj; 取得属性值直接用 obj.a; ob ...

  10. Struts2中使用HttpServletRequest和HttpServletResponse

    一.非Ioc方式 这种方式主要是利用了com.opensymphony.xwork2.ActionContext类以及org.apache.struts2.ServletActionContext类, ...