说明本文主要介绍一些chrome浏览器使用技巧,非常简单,希望对大家有所帮助。其中一些技巧在低版本中是没有的,所以建议大家使用最新版本,目前版本是62,版本很重要,如果发现有些技巧不起作用,请检查浏览器的版本。快捷键有很多,这里介绍一些常用的,我再给大家一个更完整的快捷键列表。以下快捷键可以在所有开发者工具面板使用全局快捷键窗口Mac打开。开发者工具F12、Ctrl+Shift+ICmd+Opt+I打开开发者工具,关注控制台Ctrl+Shift+JCmd+Shift+C刷新页面F5、Ctrl+RCmd+R刷新忽略缓存的页面contentCtrl+F5,Ctrl+Shift+RCmd+Shift+R元素面板中使用的快捷键元素面板窗口Mac编辑属性回车,双击属性回车,双击属性隐藏元素HH切换到在HTML中编辑F2中Styles侧边栏使用的快捷键Styles侧边栏窗口Mac转到源中的属性值声明行Ctrl+点击属性值CMd+点击属性值颜色定义值循环Shift+点击颜色选择框Shift+点击颜色选择框编辑下一个/上一个属性Tab,Tab+ShiftTab,Tab+Shiftconsole控制台窗口中使用的快捷键MacFocus控制Ctrl+Ctrl+ClearconsoleCtrl+LCmd+K,Opt+L多行输入Shift+EnterCtrl+Returnarea截屏选择页面的一部分,另存为图片1.打开开发者工具,使用快捷键F12(Windows)或Cmd+Opt+I(Mac)2.选择左上角的元素选择按钮,图标颜色变为蓝色表示被选中。3.Windows按住Ctrl,Mac按住Command,然后点击鼠标左键选择页面上的区域,松开鼠标后,截图会自动下载4.图片下载完成后自动点击图片后面的箭头,显示文件夹中节点的截图。选择页面中的一个元素并保存为图片1.打开开发者工具使用快捷键F12(Windows)或Cmd+Opt+I(Mac)2,选择任意元素node3,打开命令工具使用快捷键Ctrl+Shift+p(Windows)或Cmd+Shift+p(Mac)4、点击Capturenodescreenshot,或者在这一行输入任意关键字,比如输入node,也会出现这个选项,然后点击这个选项,图片将自动下载。5、图片自动下载后,点击图片后面的箭头,在文件夹中显示截图,将完整的网页另存为图片***方式1、打开开发者工具,使用快捷键F12(Windows)或Cmd+Opt+I(Mac)2。打开命令工具并使用快捷键Ctrl+Shift+p(Windows)或Cmd+Shift+p(Mac)3。点击Capturefullsizescreenshot,或者在这一行输入任意关键词,比如输入full,也会出现这个选项4.图片自动下载完成后,点击图片后面的箭头,显示在文件夹中。第二种方式1、打开开发者工具,使用快捷键F12(Windows)或Cmd+Opt+I(Mac)2、选择切换开发模式按钮,图标颜色会变为蓝色,表示是选择。3.点击右上角的三个小点,点击全屏截图,图片会自动下载。颜色选择器单击样式侧边栏中的任意颜色小色块,可以弹出颜色选择器1、颜色选择区域。2.稻草。3.复制到剪贴板。将显示的值复制到剪贴板。4.显示值。颜色的RGBA、HSLA或十六进制表示。5.调色板。单击其中一个方块以更改该方块的颜色。6.色调。7.透明度。8、显示值切换器。在当前颜色的RGBA、HSLA和十六进制表示之间切换。9.调色板切换器。快速添加样式规则1.在样式侧边栏中,将鼠标放在每条小样式规则上,右下方会出现三个小点。2.将鼠标放在这三个小点上,会出现5个小图标,每个小图标都有一个作用3.它们分别代表从左到右添加文字阴影添加框阴影添加颜色添加背景颜色添加样式规则添加移动设备1.打开开发者工具,使用快捷键F12(Windows)或Cmd+Opt+I(Mac)2。点击右上角的三个点,然后选择Settings3,选择Devices,然后勾选需要添加的设备。总结了这些小技巧,很简单,希望对大家有所帮助,不过有办法和时间的还是建议去官网看看,毕竟比较全面。
