怎樣獲取網頁上保存不了的圖片

今天我在寫公衆號文章的時候,需要去behance上拿它的logo用一下,做一個這樣的圖片:

dribble & behance 圓角.png

但是天不助我,打開https://www.behance.net/發現logo不能保存:

沒有圖片另存爲選項

下面我就把我的方法介紹給大家,web程序員肯定知道這個辦法,做UI或者平面的朋友可能不知道,下面我們一步一步來說:

behance網站的logo是SVG,所以本教程講的是怎樣保存網頁上做爲元素背景的SVG

方法1 複製SVG源碼

首先,使用chrome(谷歌瀏覽器)打開網頁,在那張圖片上右鍵 > 檢查

然後會彈出開發者工具,並且自動定位到圖片的源碼位置

我們可以看到這是一個SVG標籤,點擊左邊的箭頭,可以看到SVG的所有代碼

點一下SVG的頂層標籤,選中它,用鍵盤上的複製快捷鍵複製(鼠標右鍵複製會有幾種選項,方便起見用快捷鍵複製更好),這樣我們就把SVG的源碼複製到了剪貼板

在你的電腦上選擇一個文本編輯工具,這裏我使用sublime,大家使用自己熟悉的工具就好,windows用戶使用記事本就可以

粘貼出來剛纔複製的代碼

另存 > 擴展名一定要寫.svg

保存的SVG文件:

現在這就是一個很一般的svg文檔了:

我們可以在AI sketch里正常使用它:

到此爲止,大功告成。

推薦一下自己的公衆號,基本每天都會發一些自己的學習筆記,還有關於設計一類的文章(其實我個人對設計也很感興趣,比如UI,3D之類的),歡迎大家關注,多多交流

掃描二維碼關注我哦~
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章