如果你掌握這4個小技巧,全網高清圖片任意存!

2021-02-15 UI範

來源：貝茲嵐庭敘（知乎）感謝分享

---

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

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

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

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

1.圖庫網站的圖片獲取
2.公眾號頭圖獲取
3.在線編輯網站的素材獲取
4.網頁圖標獲取

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

步驟：

01.在 Chrome 瀏覽器中，打開開發者工具（快捷鍵 ⌘ +⌥+ I）。02.點擊元素選擇工具(快捷鍵，⌘ + ⇧ + C)，並選中想要圖片並點擊。
03.在右側高亮代碼行中，右鍵—Open in new tab；或者直接雙擊超連結，複製後再新頁面打開， 然後保存(ps：預覽窗口的圖片可以直接拖到本地哦)，搞定。同學們可能會覺得，就這？對，沒錯，就是這麼簡單，基本操作。
Part2.公眾號頭圖獲取很多時候我們看到公眾號的頭圖，想收下來，但是點擊詳情頁之後，頭圖是看不見的，怎麼獲取呢？當然，很多公眾號的插件可以做這些事，比如什麼壹伴插件啦，但貝叔的觀念是學一點技術，萬一呢，Always have plan B。

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

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

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

Part3.在線編輯網站的素材獲取更厲害的來了，在線編輯網站一般會對圖片元素做保護從而讓你不是這麼容易的扒到上面的圖片(你懂的)，當然了，今天貝叔就教你輕輕鬆鬆扒圖。如下圖，我們用開發者工具，也選中了圖片，但是發現不是我們想要的圖片，而是個透明的圖層，怎麼解決呢？

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

1. 檢視一下右邊的元素，可以發現是一個透明的圖層，沒關係，我們直接 delete 把這一段刪掉。2. 再選擇中一次，發現還是沒目標圖層，那就繼續刪直到預覽窗口出現我們想要的圖片為止。這裡會有一個特殊情況，有時候刪了以後現目標圖層沒了，這時候我們點一下刷新，就全部重置了，然後刪到剛才那一步，點擊 div 容器旁邊的小箭頭展開，就能看到我們想要的圖片了。

△ 有時會出現的特殊情況

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

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

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

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

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

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

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

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

公眾號推送官方改版啦

想要每日接收UI範的推送

可以做好以下兩點：

1、進入公眾號將UI範【設為星標】

2、經常點擊文章右下角的【在看】

謝謝小可愛們，每天進步一點！

---

精選推薦

- 

本期完

-

點我 · 讓工作變得更簡單 

相關焦點

  • 掌握這7個技巧,讓你PPT背景設計無人能及
    好像隨便擺幾個字，PPT就能變得高大上，都是在哪裡找的？其實，好看的不是圖片本身，而是它們掌握了一些特殊的圖片處理技巧。接下來，我將由淺到深，給大家介紹3大常用的，圖片處理技巧。有時候圖片較為複雜，沒有足夠的留白，如果我們直接把文字放在圖片上，就會給人凌亂不清晰的感覺。文字是不是立馬就清晰很多呢？至於操作，也很簡單，就是插入一個矩形，調整透明度覆蓋在圖片上即可。
  • 小技巧大作用,這4個Word表格技巧你要掌握
    你還不會調整Word表格大小嗎？本期Word妹與大家分享4個Word技巧。
  • PPT圖片外框設置的4 個小技巧!
    對於這種情況，一般有 4 個小技巧，如下：第1個技巧，利用三維旋轉的 Z 旋轉。 如果對圖片二維旋轉，則圖片外框也會跟著旋轉；如果對圖片三維旋轉，則圖片框則不會一同旋轉。如此處理之後，即可得到合適的「轉正」圖片。對於第3個技巧，可通過和其他對象相組合，使得圖片外框調至和圖片方向相一致。
  • 教你4個破解技巧,全網任意複製
    下面教大家4個破解技巧，全網任意複製。閱讀引導：閱讀本文預計需要2分鐘，不足之處請多多指教。本文的主要內容是：教你4個破解網頁複製技巧。第一時間獲取最新內容，歡迎關注『迅捷CAD』。技巧一、本地網頁當我們遇到不讓複製的網頁，直接通過滑鼠右擊，選擇另存為，然後將保存類型設置為「網頁(單個文件)」。
  • 你是不是遇到,在花瓣網部分圖片詳情頁,點擊「放大鏡」無法預覽高清大圖?
    -- START --前段時間，想必大家應該發現，在花瓣網圖片詳情頁點擊右上角的「放大鏡」，無法查看原始大圖，顯示的是不清晰的縮略圖。不過，如果是已安裝了「率葉插件」的用戶，應該沒有任何感覺，因為率君已及時修復了這個詳情頁放大鏡看原始大圖的BUG，所以您預覽的還是原圖。好消息！
  • Word教程:如果這 4 個Word小技巧不會的話,你可能要忙半天!
    因此，今天小編將為大家分享幾個實用的的Word小技巧，這些技巧貌似不起眼，但是學會後，可以大大提升Word操作效率哦！01重疊字快速錄入輸入文字，是Word中最最基礎的操作，也是製作文檔的第一步。通常，我們在輸入文字時，常要輸入兩字、三字、四字的重疊字。
  • 關於Word圖片,這5個技巧你會嗎?
    圖片的用法在實際工作中是最常見的，用得好可以讓你的文檔更加美觀大方，本期Word妹與大家分享5個小而實用的技巧。1、如何把圖片設置成Word的背景在寫一些總結性文章或者宣傳冊時，為了讓文檔更加生動，時常會添加一張圖片作為背景，那你知道怎麼把圖片設置成背景嗎？點擊設計——頁面設置——頁面顏色——填充效果——圖片——選中圖片即可。
  • MATLAB處理數據,掌握這7個小技巧就夠了!
    最近一段時間，工作上花了不少時間用MATLAB處理工廠下線的數據，數據龐大不說，複雜度也高，各種推算和統計 所以今天我打算總結一下，平時我在用MATLAB做數據分析時常用的幾個小技巧 不過，至於圖片的細節，像title，legend，網格，還是需要自己微調，但這都不是事，再安利大家一個簡單的方法，完全不用上網去搜 在生成窗口中，點擊屬性檢查器，然後根據自己的需要完善圖片的細節
  • 小程序「居其家居」可以預覽高清圖片了!
    小程序上線僅僅只是一個開始，我們正在不斷的完善，最近我們作出了如下優化：1、配色方案的高清預覽。目前小程序中的配色方案都不提供下載，而且圖片無法放大查看細節，針對這個問題，我們新版本中增加了配色方案的PDF高清預覽。屆時，大家只要在配色方案最下方點擊「PDF高清預覽」，就可以查看高清圖片了。2、優化界面。
  • 花2分鐘,掌握這10個Word技巧,讓你長久受益!
    多掌握一些技巧，讓你的工作效率翻倍！
  • PPT圖片外框「歪」了到底怎麼調?這裡有4個小技巧
    以後設計PPT時，遇到這樣的情況，不如試一試這4個小技巧，或許一下子你就可以將圖片的外框調「正」了。例如，一個圖片素材，在對它的大小位置進行調整時，發現圖片外部的框線（也就是帶白色控點的邊框），它的方向與圖片內容方向並不是一致的，如外框是正的時候，圖片內容是歪的。這種情況下，把圖片旋轉一下的話，圖片內容正了，但外框歪了。
  • 25個免費下載高清圖片的最佳圖庫網站
    我們都喜歡尋找一些有特色和比較有趣個性的圖片來使用，可廣泛用於素材和分享，鑑於國內圖片類站點的資源重複率比較高，小編在這裡給大家整理了25個非常出色的高清圖片下載站點，可以找到免費、高解析度圖片。免費高清壁紙分享網是一個堅持每天分享高清的攝影圖片的站點，全是生活中的景象作品，清新的生活氣息圖片可以作為桌面壁紙也可以應用於各種需要的環境。
  • Kindle使用小技巧最全合集!這14條,你知道多少?
    但你知道嗎？Kindle有許多使用上的小技巧，掌握這些小技巧，絕對能大大優化你的閱讀體驗！網上一搜，可以找到許多這方面的帖子、攻略；看得人眼花繚亂。今天，我們就要針對這個話題，為大家進行一次大匯總，不敢說將Kindle的小技巧全部網羅進來了，但，絕對是最全的。
  • 25個免費下載高清圖片的最佳圖庫網站(收藏吧)
    我們都喜歡尋找一些有特色和比較有趣個性的圖片來使用，可廣泛用於素材和分享，鑑於國內圖片類站點的資源重複率比較高，小編在這裡給大家整理了25個非常出色的高清圖片下載站點，可以找到免費、高解析度圖片。1.Unsplash免費高清壁紙分享網是一個堅持每天分享高清的攝影圖片的站點，全是生活中的景象作品，清新的生活氣息圖片可以作為桌面壁紙也可以應用於各種需要的環境。
  • 25個免費下載高清圖片的網站丨最佳圖庫,收不收藏看了你
    →點選「設為星標★來源丨小甜家Time（wujie-ad)整理丨設薈人Design我們都喜歡尋找一些有特色和比較有趣個性的圖片來使用，可廣泛用於素材和分享，鑑於國內圖片類站點的資源重複率比較高，小編在這裡給大家整理了25個非常出色的高清圖片下載站點，可以找到免費
  • Word中插入公式一點都不難,掌握這4個技巧就能100%搞定!
    今天小編帶領大家get幾個小技巧。01Word 插入公式的幾個方法（ 你知道幾種方法，請閉上眼睛想一下）好，不賣關子了，我提供幾個途徑：第一，圖片第二，插件>第三，公式編輯器第四，域代碼接下來，我將分別介紹一下 4 種途徑，第一個最不推薦的方法：方法1：圖片法即插入圖片或截圖，完成公式的插入，但致命缺點非常明顯：
  • 有關Word論文封面問題,這2個技巧你掌握了嗎?
    1、論文封面下劃線怎麼打在製作論文封面時，一般要求是下圖中的第二種格式，可是當你自己操作製作時，卻是第一種格式，那如何製作出第二種格式的下劃線呢？第二種情況用到的技巧其實不多，這裡主要是用到表格、邊框以及表格屬性。
  • 分享:22個無版權、免費、高清圖片素材網站
    今天的內容你可要收藏分享好嘞！這些小GET提供給愛學習的你，讓你的製作變得更輕鬆！SO~關注我，不要錯過每一次的分享！，全是生活中的景象作品，清新的生活氣息圖片可以應用於各種需要的環境，非常值得收藏。而且它可以通過顏色來查找圖片，無須註冊、登入，即可在線下載圖片。如果你要找特定顏色的圖片，那麼在如上Visual Hunt首頁搜索框底下，點擊相應的色條就可以了！選擇後，就會出來同樣色系的圖片素材供你使用，上方還能選擇授權類型。
  • 掌握這些小技巧,讓你玩轉iPhone
    前幾天我們介紹了iPhone有什麼能耐，今天我們來講講iPhone的其他小技巧，也許還有很多朋友不知道！
  • 你還在用系統壁紙?火爆全網的4款壁紙APP,個個精品!附贈60+高清壁紙
    今天會給大家推薦4款壁紙APP、3個電腦網站，文末還附贈7大風格60+壁紙，記得去文末領取哦。「堆糖」是一個擁有海量美圖的興趣社區APP，內含幾十億高清優質圖片，還有數千萬堆糖用戶的珍藏分享，你肯定能在上面找到你心水的壁紙。