大家好，這裡是貝茲嵐，野生互聯網設計師一枚~

現如今打開網站找參考已經是很多設計師打開電腦的第一件事了，貝叔也是如此，但凡遇到點好看的圖片總會想着扒下來放在自己的庫里，下次有類似的需求時候就可以快速查看，給自己提供思路。

既然都知道建立個人圖庫的重要性，回歸到圖片的來源，怎麼扒才算優雅呢？

不是所有網站的圖片都能右鍵保存的，去問開發小哥么？ 一來，他們很忙可能沒空理會，二來，這個問題太基礎會被鄙視。

本文結合 4 種需要扒圖的場景，提供如何獲取的小技巧：

• 圖庫網站的圖片獲取
• 公眾號頭圖獲取
• 在線編輯網站的素材獲取
• 網頁圖標獲取

Part1.圖庫網站的圖片獲取

以國外某某著名圖庫為例子，比如我們看到一張不錯的風景圖，點擊右鍵沒有保存菜單，而且不管對圖片進行怎麼樣的交互動作，均不會出現右鍵菜單，這是很典型的圖片保護了。

那麼，先來一個基本操作 3 連搞定：

1. 在 Chrome 瀏覽器中，打開開發者工具（快捷鍵 ⌘ +⌥+ I）。
2. 點擊元素選擇工具(快捷鍵，⌘ + ⇧ + C)，並選中想要圖片並點擊。
3. 在右側高亮代碼行中，右鍵—Open in new tab；或者直接雙擊超鏈接，複製后再新頁面打開， 然後保存(ps：預覽窗口的圖片可以直接拖到本地哦)，搞定。

同學們可能會覺得，就這？對，沒錯，就是這麼簡單，基本操作。

Part2.公眾號頭圖獲取

很多時候我們看到公眾號的頭圖，想收下來，但是點擊詳情頁之後，頭圖是看不見的，怎麼獲取呢？

當然，很多公眾號的插件可以做這些事，比如什麼壹伴插件啦，但貝叔的觀念是學一點技術，萬一呢，Always have plan B。

那麼，我們來個「曲線救國」4 步搞定它：

1. 複製文章鏈接，在瀏覽器中打開.以這篇文章為例，打開後點擊右上角使用默認瀏覽器打開。
2. 右鍵—显示網頁源代碼，全局搜索(⌘+F)var msg。
3. 搜索結果中，找到 var msg_cdn_url 代碼後面的鏈接，複製並在新頁面中打開。
4. 在新的窗口中打開，右鍵就可以保存下來了，搞定。

到這是不是覺得，哎，學到了，技能點+1，別急，後面還有更厲害的，同樣也十分簡單。

Part3.在線編輯網站的素材獲取

更厲害的來了，在線編輯網站一般會對圖片元素做保護從而讓你不是這麼容易的扒到上面的圖片(你懂的)，當然了，今天貝叔就教你輕輕鬆松扒圖。

如下圖，我們用開發者工具，也選中了圖片，但是發現不是我們想要的圖片，而是個透明的圖層，怎麼解決呢？

那麼，我們「化繁為簡」4 步解決：

1. 檢視一下右邊的元素，可以發現是一個透明的圖層，沒關係，我們直接 delete 把這一段刪掉。

2. 再選擇中一次，發現還是沒目標圖層，那就繼續刪直到預覽窗口出現我們想要的圖片為止。

這裡會有一個特殊情況，有時候刪了以後現目標圖層沒了，這時候我們點一下刷新，就全部重置了，然後刪到剛才那一步，點擊 div 容器旁邊的小箭頭展開，就能看到我們想要的圖片了。

△ 有時會出現的特殊情況

3. 再選擇中一次，發現還是沒選中我們想要的圖層，不要慌，重複上面的操作。

4. 最後，我們拿到了我們想要的圖層，搞定！

這樣就刪除了層層阻礙，我們就得到了想要的圖層，其實非常非常的容易，拓展小知識，”div”是個容器，大家可以理解成「組」，獲取圖片的思路其實就是把沒用的圖層刪掉。

Part4.網頁圖標獲取

網頁圖標(Favicon)也就是網站的頭像，有些時候我們可能也需要，怎麼弄呢，十分容易。

兩種方法，輕鬆搞定

方法一：直接在網址後面輸入/favicon.ico，即可獲取網頁圖標

此方法尚存不足，不是所有網站都能這樣操作，部分大網站可以。

方法二：用開發者工具輕鬆找到他的圖片鏈接，具體操作如下：

1. 打開開發者工具(⌘+⌥+I)
2. 全局搜索「Favicon」(⌘+F)
3. 點擊選中的代碼行，右鍵—open in new tab，即可在新頁面中保存網頁圖標。

那麼今天介紹的這四種扒圖的小技巧到這邊就結束了，非常容易上手，掌握后便可以優雅的扒圖了呢，快去試試吧。如果你還有什麼扒圖的問題或技巧歡迎留言互相交流。

拓展閱讀：

閱讀文章 >>

這裡是貝茲嵐，野生互聯網設計師一枚，持續分享設計有用功，我們下期見。

未经-摩登3注册-摩登3测速官网-允许不得转载：摩登3注册-摩登3测速官网 » 無極五測速註冊_掌握這4個小技巧，全網高清圖片任意存！