【譯】你不知道的Chrome除錯工具技巧第四天：the Elements panel（元素皮膚）

本文是作者 Tomek Sułkowski 釋出在 medium 上的一個系列。據作者透露一共有 24篇 ，一直更新到12月24日
版權歸原作者所有。

前兩篇的翻譯連結我已經給到了作者本人，雖然他不理解中文，但是他還是很開心哈哈,截圖在最後

譯者在翻譯前已經和作者溝通得到了翻譯整個系列的授權。
為了不影響大家閱讀，授權的記錄在這裡

在馬上就要迎來假期的這 24 天裡，我將會發布一系列短篇的文章，關於如何更加有意思的使用開發工具，昨天我們說到了第 11 個,所以今天我們就從 12 個，元素皮膚( Element panel )開始：

可以按下 'h' 來隱藏在元素皮膚中被你選中的元素。再次按下 'h' 使它出現。某些時候這是很有用的，例如你想截圖，但是又不想裡面包含一些敏感資訊。

當你想要看看頁面某部分在 DOM 樹的不同位置將如何顯示的時候，只需拖動並且放置它(到指定的位置)，就像在你機器上其他任何地方一樣 :-)

如果只是想在 DOM 結構中往上一點或者往下一點的移動當前被你選中的元素，你可以使用 [ctrl] + [⬆] / [ctrl] + [⬇] ( [⌘] + [⬆] / [⌘] + [⬇] on Mac).

此刻我們可以拖動，放置，編輯，複製 (當然，以及使用 [ctrl] + [v] 來貼上), 所以一旦我們在 Elements 皮膚中弄亂了我們的 HTML 結構，我們不應該感到驚訝。

在任何文字/圖形編輯器中的標準是什麼：

使用 [ctrl] + [z] ([⌘] + [z] on Mac) 撤銷我們的任何改動。使用 [ctrl] + [shift] + [z] 重新編輯我們的任何修改。

慣例：如果你從這裡學到了一些新東西

→ 你可以點個贊再走嘛~
→ 關注我的 Twitter Tomek Sułkowski

其他此係列的文章，馬上就會翻譯出來，到時會貼出對應的連結在此處。

如果你對我的翻譯表示肯定，也可以關注我一波哦~ 順便我的開源專案，求一波 star→ 看這裡, 美麗的部落格系統

相關文章