【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. java判断字符串中是否包含中文 过滤中文

    package com.test; import java.util.regex.Matcher; import java.util.regex.Pattern; public class Test ...

  2. 学python的第二天

    我是一个有一点点c语言基础的大二学生,今天的积累 cd指令=change directory(目录) dir=查看当前目录文件列表 convert   转化   defind  定义 cd ..   ...

  3. 错误：SyntaxError: Missing parentheses in call to 'print'

    1.Python3编译器使用print函数需加括弧 print(XXX) 而Python 2可以print XXX 2.Python3表示不等只能用"!=" 3.在python3中 ...

  4. js检查字符串的包含关系

    首先想到的是str.contains(),用的时候发现报错了 正确的判断方法应该用:str.indexof(substring),不包含的话,返回-1.大小写敏感 var rsp = response ...

  5. ThreadLoacl 小记

    参考地址: https://www.cnblogs.com/dolphin0520/p/3920407.html ThreadLoacl 本地线程变量 为线程创建一个副本, 一个内部类ThreadLo ...

  6. mybatis初识

    mybatis采用弱连接,在一定程度上集中管理了sql的语句编写,又实现了自动映射bean. 此处以最基础的mybatis连接为例: 引入jar包: mybatis-3.4.5.jar ojdbc-6 ...

  7. tfs对接数据-File

    在使用tfs时,数据结构 /** * getFile */ @RequestMapping("/tfs/{fileName}") public ResponseEntity< ...

  8. Linux命令之top

    Linux中的top命令显示系统上正在运行的进程.它是系统管理员最重要的工具之一.被广泛用于监视服务器的负载.在本篇中,我们会探索top命令的细节.top命令是一个交互命令.在运行top的时候还可以运 ...

  9. vue：vue引入组建的多种写法

    vue的路由组件中,引入模块的两种写法:(@等价于..)死的写法:不是按需加载1:import Index from '@/components/Index'(import Index from '. ...

  10. linux /dev/null 中有数据

    前段时间有个同事问我说,他 cat /dev/null有数据.这个颠覆大家认知的问题最终却是个小问题. 我们来看/dev/null的操作函数: static const struct memdev { ...