這篇文章主要介紹的就是一些chrome瀏覽器的小技巧奏黑，很簡單痰憎，希望對大家有所幫助。
這其中的一些小技巧在低版本中是沒有的攀涵，所以建議大家用最新版的，目前最新版是62洽沟，版本很重要以故，如果發(fā)現(xiàn)有些技巧不起作用，請先查看瀏覽器的版本裆操。
快捷鍵
快捷鍵比較多怒详，這里挑出幾個常用的說一下
最后會給出一張比較完整的快捷鍵的表
下列快捷鍵可以在所有 開發(fā)者工具 面板中可以使用
全局快捷鍵windowMac
打開 開發(fā)者工具F12、Ctrl+Shift+ICmd+Opt+I
打開 開發(fā)者工具 并聚焦到控制臺Ctrl+Shift+JCmd+Shift+C
刷新頁面F5踪区、Ctrl+RCmd+R
刷新忽略緩存內(nèi)容的頁面Ctrl+F5昆烁、Ctrl+Shift+RCmd+Shift+R
在Elements 面板中使用的快捷鍵
Elements 面板windowMac
編輯屬性Enter、雙擊屬性Enter缎岗、雙擊屬性
隱藏元素HH
切換為以HTML形式編輯F2
在Styles 邊欄中使用的快捷鍵
Styles 邊欄windowMac
轉(zhuǎn)到源中屬性值聲明行Ctrl+點擊屬性值CMd+點擊屬性值
在顏色定義值之間循環(huán)Shift+點擊顏色選取器框Shift+點擊顏色選取器框
編輯下一個/上一個屬性Tab静尼、Tab+ShiftTab、Tab+Shift
在控制臺中使用的快捷鍵
控制臺windowMac
聚焦到控制臺Ctrl+Ctrl+
清除控制臺Ctrl+LCmd+K、Opt+L
多行輸入Shift+EnterCtrl+Return
區(qū)域截屏
選取頁面中的一部分鼠渺，保存為圖片
1鸭巴、打開開發(fā)者工具
使用 快捷鍵 F12 (Windows) 或 Cmd+Opt+I (Mac)
2、選擇左上角的元素選擇按鈕拦盹，圖標顏色變?yōu)樗{色即表示選中了
3鹃祖、Windows 下按住 Ctrl，Mac 就按住 Command普舆，然后點擊鼠標左鍵在頁面選擇區(qū)域即可恬口，松開鼠標后，截圖自動下載沼侣。
4祖能、圖片自動下載好后，點擊圖片后面的箭頭华临，可以在文件夾中顯示
節(jié)點截圖
選中頁面中某一元素芯杀，保存為圖片
1、打開開發(fā)者工具
使用 快捷鍵 F12 (Windows) 或 Cmd+Opt+I (Mac)
2雅潭、選中任意元素節(jié)點
3揭厚、打開命令工具
使用快捷鍵 Ctrl + Shift + p (Windows) 或 Cmd + Shift + p (Mac)
4、點擊Capture node screenshot扶供，或者輸入這行中任意的關(guān)鍵字筛圆，比如輸入node，也會出來這個選項椿浓，然后點擊這個選項太援，圖片會自動下載。
5扳碍、圖片自動下載好后提岔，點擊圖片后面的箭頭，可以在文件夾中顯示
截全屏
保存完整網(wǎng)頁為圖片
第一種方式
1笋敞、打開開發(fā)者工具
使用 快捷鍵 F12 (Windows) 或 Cmd+Opt+I (Mac)
2碱蒙、打開命令工具
使用快捷鍵 Ctrl + Shift + p (Windows) 或 Cmd + Shift + p (Mac)
3、點擊Capture full size screenshot夯巷，或者輸入這行中任意的關(guān)鍵字赛惩，比如輸入full，也會出來這個選項
4趁餐、圖片自動下載好后喷兼，點擊圖片后面的箭頭，可以在文件夾中顯示
第二種方式
1后雷、打開開發(fā)者工具
使用 快捷鍵 F12 (Windows) 或 Cmd+Opt+I (Mac)
2季惯、選中 切換開發(fā)模式按鈕吠各，圖標顏色變?yōu)樗{色即表示選中了
3、點右上方的三個 小點星瘾，點擊Capture full size screenshot走孽，圖片會自動下載
拾色器
在Styles邊欄 點擊任意顏色的小色塊，就可以彈出顏色選擇器
1琳状、顏色選擇區(qū)域磕瓷。
2、吸管念逞。
3困食、復(fù)制到剪貼板。將顯示值復(fù)制到剪貼板翎承。
4硕盹、顯示值。顏色的RGBA叨咖，HSLA或十六進制表示瘩例。
5、調(diào)色板甸各。單擊其中一個方塊將顏色更改為該方塊垛贤。
6、色相趣倾。
7聘惦、透明度。
8儒恋、顯示值切換器善绎。在當前顏色的RGBA，HSLA和Hex表示之間切換诫尽。
9禀酱、調(diào)色板切換器。
快速添加樣式規(guī)則
1牧嫉、在Styles 邊欄剂跟，鼠標放在每一小塊樣式規(guī)則上，右下方都會有三個小點
2驹止、鼠標放在這三個小點上，會出現(xiàn)5個小圖標观蜗，每個小圖標都有作用
3臊恋、他們從左到右分別代表
添加 text-shadow
添加 box-shadow
添加 color
添加 background-color
插入樣式規(guī)則
增加移動設(shè)備
1、打開開發(fā)者工具
使用 快捷鍵 F12 (Windows) 或 Cmd+Opt+I (Mac)
2墓捻、點擊右上方的三個小點抖仅，然后選擇Settings
3坊夫、選擇Devices，然后在需要添加的設(shè)備前面打上勾就可以了
總結(jié)
這些小技巧撤卢，很簡單环凿，希望對大家有所幫助，不過對于有辦法放吩，有時間的朋友還是建議去官網(wǎng)看看吧智听，畢竟那里才更加全面。
在學(xué)習(xí)的小伙伴也可以+裙289683894交流學(xué)習(xí)渡紫，領(lǐng)取資料
