提升程序員工作效率的工具/技巧推薦系列
- 推薦一個功能強大的文件搜索工具SearchMyFiles
- 介紹一個好用的免費流程圖和UML繪製軟件-Diagram Designer
- 介紹Windows任務管理器的替代者-Process Explorer
- 介紹一個強大的磁盤空間檢測工具Space Sniffer
- 如何在電腦上比較兩個相似文件的差異
- 程序員工作效率提升系列-推薦一個JSON文件查看和修改的小工具
- 將Chrome調試器裏的JavaScript變量保存成本地JSON文件
- 分享一個開源的JavaScript統計圖表庫，40行代碼實現專業統計圖表
- 推薦一個短小精悍的Chrome緩存管理工具-ChromeCacheView
- 給程序員的福利-分享一個將代碼轉換成圖片的在線網站
前端開發人員經常需要將當前的網頁截圖發給產品經理討論。如果網頁很長，一個屏幕顯示不下，那麼操作系統自帶的截圖功能就沒有辦法截取整個屏幕了。
最近我找到一個辦法，通過Chrome開發者工具自帶的截圖功能可以截取超過一個屏幕的完整網頁視圖。
下面分享給大家。
打開要截取完整屏幕的網頁，打開Chrome開發者工具，按住快捷鍵Ctrl+Shift+P，會看到很多可用命令，
在命令提示符裏輸入“full”，會看到只有一個可用選項：Capture full size screenshot：
點擊這個命令，Chrome就自動截取當前網頁的完整圖片，並且提示我們另存到本地。
大家可以看看這個效果：
是不是非常方便？大家從Chrome開發者工具的命令行裏還能發現很多其他有用的功能，比如只截取網頁上指定元素。
假設我想只截取bing搜索結果頁面裏id爲b_content的元素對應的內容，
在命令裏選擇Capture node screenshot即可：
下圖就是隻截取b_content元素對應的截圖結果：
要獲取更多Jerry的原創技術文章，請關注公衆號"汪子熙"或者掃描下面二維碼:
