相信很多同學(xué)都有截圖的需求，有時候一個網(wǎng)頁的內(nèi)容很多，根本沒法把所有內(nèi)容都截取在同一張圖片上，有同學(xué)可能會把每頁截圖再重新拼接起來。

其實(shí)，我們可以使用工具和瀏覽器開發(fā)者工具來實(shí)現(xiàn)網(wǎng)頁長圖的截取。

以前我分享過一些工具，來實(shí)現(xiàn)抓取整個網(wǎng)頁的信息內(nèi)容。

但是這些工具截取出來的圖片質(zhì)量沒有很高，在清晰度方面始終有些不足。

并且有些截圖工具使用起來會比較麻煩。

所以，今天教大家怎么使用Chrome瀏覽器的開發(fā)者工具命令來截取網(wǎng)頁的長圖。

比如我現(xiàn)在想截取quora網(wǎng)站上的這個首頁長圖，從動圖可以看到，這個首頁的信息還是比較多的。

現(xiàn)在我們使用快捷鍵F12調(diào)出開發(fā)者工具，你也可以右擊鼠標(biāo)，然后找到檢查元素，進(jìn)入開發(fā)者工具

然后使用快捷組合鍵Ctrl+shift+P，打開一個可以輸入命令查找文件的窗口

然后輸入：Capture full size screenshot，意思是抓取全網(wǎng)頁面的截圖

然后Chrome瀏覽器就會自動抓取網(wǎng)頁的截圖，然后把這個網(wǎng)頁截圖保存到本地了

如果你只想截圖當(dāng)頁面的內(nèi)容，那么你可以直接輸入：Capture screenshot，就可以截取屏幕當(dāng)頁的內(nèi)容信息

如果你想再電腦端模擬手機(jī)版的截圖，那么你可以在開發(fā)者工具的左上角，點(diǎn)擊那個圖標(biāo)切換設(shè)備，你也可以使用快捷鍵Ctrl + Shift + M

當(dāng)你點(diǎn)擊之后，頁面顯示就會從網(wǎng)頁版就會切換為手機(jī)版

如下動圖

并且我們可以設(shè)置為不同手機(jī)的大小，模仿不同手機(jī)來截取長圖，然后截取手機(jī)版的長圖跟上面的方法一樣

輸入Capture full size screenshot，就可以了

總結(jié)

以上是生活随笔為你收集整理的HTML开发者工具抓取所有图片,利用开发者工具，截取网页高清长图的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。