浏览器Goole Chrome调试工具

打开命令菜单

1.打开检查》右键》检查或者F12
2.windows：ctrl+shift+p
mac：command+shift+p

黑色主题

：输入dark theme

点击之后弹出 Reload DevTools 点击后黑色主题

-反之浅色主题，同样方法，输入light thme

截屏

1.还是打开菜单后》
输入screenshot

第一个：
Capture area screenshot是可以任意截屏一部分，然后下载到了我们电脑上

第二个：
Capture full size screenshot 截取整个网页即Dom（包括滚动条的）
第三个：
Capture node screenshot 截取了网页的某个节点,可以先选择好节点（控制台左上角鼠标选择节点）
第四个：
Capture screenshot 截取网页部分

浏览器Goole Chrome调试工具相关推荐

chrome浏览器安装redux-devtools调试工具
chrome浏览器安装redux-devtools调试工具 1.点击进入https://www.chromefor.com/ 2. 在搜索框搜索redux 3. 找到最新版本(Redux DevToo ...
不常见但很有用的chrome调试工具使用方法
前面的话对于chrome调试工具,常用的是elements标签.console标签.sources标签和network标签.但实际上,还有一些不太常见但相当实用的方法可以提高网页调试效率.本文将 ...
chrome调试工具高级不完整使用指南（基础篇）
一.前言本文记录的是作者在工作上面对chrome的一些使用和情况的分析分享,内容仅代表个人的观点.转发请注明出处(http://www.cnblogs.com/st-leslie/),谢谢合作二. ...
【译】你不知道的 Chrome 调试工具技巧第二十天：Workspace的黑魔法
特别声明本文是作者 Tomek Sułkowski 发布在 medium 上的一个系列.据作者透露一共有 24 篇,一直更新到 12 月 24 日版权归原作者所有. 作者在 Twitter 上推荐 ...
【译】你不知道的Chrome调试工具技巧第七天：异步console的趣味小窍门
特别声明本文是作者 Tomek Sułkowski 发布在 medium 上的一个系列.据作者透露一共有24篇,一直更新到12月24日版权归原作者所有. 前两篇的翻译链接我已经给到了作者本人,虽然 ...
前端~css~Chrome调试工具、元素显示模式、盒模型、flex弹性布局
文章目录 Chrome调试工具块级元素行内元素盒模型 flex布局(弹性布局) 常用属性 Chrome调试工具在浏览器任何一个网页中,鼠标右键单击,选择检查,可打开调试工具.或者f12键. 打 ...
CSS笔记二-选择器、背景相关属性、元素显示模式、CSS三大特性、chrome调试工具、PXcook使用
一.复合选择器 1.后代选择器根据HTML标签的嵌套关系,选择父元素后代中满足条件的子元素: 选择器语法:选择器1 选择器2 {css} 结果:在选择器1中所找到标签的后代(儿子.孙子.重孙子... ...
Goole Chrome 谷歌浏览器无法打开设置、闪退、崩溃
Goole Chrome 谷歌浏览器无法打开设置.闪退最近谷歌浏览器突然抽风,双击无法打开:任务管理器查看进程存在,但是直接闪退. 1.首先解决无法打开的问题: 多次双击直到浏览器打开为止 2.两种 ...
chrome调试工具的使用
chrome调试工具 1.调试工具的打开方式: 打开浏览器,按下F12或者右击鼠标选择检查选择元素即Elements,当我们把调试框放在屏幕下沿时,左边是html,右边是css (我们可以选择屏幕右 ...

浏览器Goole Chrome调试工具

打开命令菜单

黑色主题

截屏

浏览器Goole Chrome调试工具相关推荐

最新文章

热门文章