![d58367657d779b5389ca293950ad01d7.png](https://i-blog.csdnimg.cn/blog_migrate/95ba740447e051441493d839d35cd7bf.png)
问题描述:
浏览网页有时需要截取当前网页局部内容或者将整个网页保存为图片;
常规方法:
1、系统自带的屏幕截图功能:(Prt Sc->Print Screen)截取整个屏幕到剪切板->去word粘贴即可;
缺点:可能包含不需要的内容;无法截取屏幕以外内容;
2、微信客户端截图功能:可以截取当前屏幕想要的任何区域。
缺点:无法截取屏幕以外的内容;
3、额外安装专门的浏览器插件或者专门的软件;
解决方案:
1、采用Chrome谷歌浏览器自带功能截取网页局部内容或者整个网页内容;2、安装专门浏览器插件(下一篇文章再续);
PC截取局部或整个网页长图-操作步骤:
1、浏览器打开需要截图的网页;
2、进入调试模式:
Windows系统:按F12
苹果IOS系统:按Command +Option +I
3、打开命令窗口:
windows系统:按ctrl+shift+p
苹果IOS系统:按Command+Shift +P
附图1为1/2/3步骤操作后的最终样图:
![796e925fea552ee76b36f0fd93afbf6d.png](https://i-blog.csdnimg.cn/blog_migrate/252f0f4af3532ec794db302b91ae72d7.jpeg)
4.1、局部截图:命令窗口输入“Capture area screenshot ”,然后按住鼠标左键在网页上选择想要截图的区域;
4.2、整个长网页截图:命令窗口输入“Capture full size screenshot ”;
5、浏览器自动截取网页内容为图片 自动保存到浏览器默认的文件下载路径;
模拟手机截取局部或整个网页长图-操作步骤:
1、浏览器打开需要截图的网页;
2、进入调试模式:
Windows系统:按F12
苹果IOS系统:按Command +Option +I
3、切换当前网页显示模式为手机模拟显示,参照下面附图2操作步骤;
4、打开命令窗口:
windows系统:按ctrl+shift+p
苹果IOS系统:按Command+Shift +P
5、局部截图或者整个网页截图惨遭上面步骤4.1 4.2;操作步骤比起前面的PC网页截图 多了一个第3步 其他操作都一样
![d0448eeaf33b4a1117f427905bddbe5c.png](https://i-blog.csdnimg.cn/blog_migrate/5c93b03d4a73fd7123dff37db940f92e.jpeg)
PC截取整个网页长图效果浏览:
![268601f8387ee500e3cfb6d8d627cb29.png](https://i-blog.csdnimg.cn/blog_migrate/d3baf3a40f5f8cbcfd36f395c0683081.jpeg)
模拟手机截取整个网页长图效果:
![9d2ce47587f273aa69b45308a10ad1fc.png](https://i-blog.csdnimg.cn/blog_migrate/4613798578ad50c14ff8a4190f3c0246.jpeg)