【GET TIPS】Chrome所见即所得的截图技巧
精简的前言:
对,我就是想说下事情的来龙去脉。您要不想听,就把耳朵捂起来23333。
想截个新冠肺炎病毒,全国确诊人数今日增长的图,以确定非湖北地区不再明显增长。
但由于网页需要的内容分布在两页,需要滚轮截图,微信自带的截图没法实现。
所以找到了此法,Chrome 自带的 Capture Node Screenshot 截屏,谁用谁香。
整体步骤:
- Devtool 选中 Node
- Ctrl + Shift + P(Mac 上 Command + Shift + P)
- Capture Node Screenshot
过程示例:
网址:https://news.sina.cn/zt_d/yiqing0121
F12 选中节点,在节点上按「Ctrl + Shift + P」,
如果是 Mac 的话按「Command + Shift + P」,
这时会弹出一个输入框,
然后在输入框中输入node,
选Capture Node Screenshot ,
回车就自动下载了。

最终效果:

【GET TIPS】Chrome所见即所得的截图技巧的更多相关文章
- 截图技巧——鼠标按着不懂,同时点击截图快捷键(QQ为ctrl+alt+a)即可避免按下快捷键鼠标按下等操作消失截不到的尴尬。
截图技巧--鼠标按着不懂,同时点击截图快捷键(QQ为ctrl+alt+a)即可避免按下快捷键鼠标按下等操作消失截不到的尴尬.
- 5个提升Google Chrome浏览器运行速度的技巧
尽管有无数个喜欢Google Chrome 浏览器的理由,其中就包括,Chrome已经够快了,但Google Chrome的内存占用而导致的速度拖累还是广受诟病,这种弊端在windows下尤为明显, ...
- Mac 下的截图技巧
最近想制作GIF图片,截图后,发现没有截出鼠标小效果,自己就查阅了一下资料,总结了不少的截图技巧,这里写下来,权当笔记,方便今后检索,方便别人共享. 方法一: 下载 QQ,在QQ的皮娜好设置里面设置截 ...
- chrome 浏览器的使用技巧
前端工程师大部分的工作成果都需要在浏览器中查看,使用 chrome 浏览器的频率非常高.更好更优雅地使用 chrome,将 chrome 配置成一款趁手的浏览器,将极大地提升编程效率.本文将详细介绍 ...
- Chrome浏览器如何完美实现滚动截图技巧
一.前言 我们平时在浏览网页时,想把碰到好的网页内容或者文章截屏保存,但是网页的长度常常会超出屏幕高度,一般的截屏功能只能截取显示在屏幕上的内容,那我们该如何方便快捷截取全部内容?今天就分享一个如何利 ...
- Chrome 浏览器如何完美实现滚动截图技巧
一.前言 我们平时在浏览网页时,想把碰到好的网页内容或者文章截屏保存,但是网页的长度常常会超出屏幕高度,一般的截屏功能只能截取显示在屏幕上的内容,那我们该如何方便快捷截取全部内容?今天就分享一个如何利 ...
- chrome developer tool 调试技巧2
我大概是从 08.09 年从 Firebug 转入 Chrome Developer Tool,一直用到现在,越用越喜欢.我平时调错时常用的功能有: 代码格式化可以将被压缩的代码自动展开 实时代码编辑 ...
- [转]Tips——Chrome DevTools - 25 Tips and Tricks
Chrome DevTools - 25 Tips and Tricks 原文地址:https://www.keycdn.com/blog/chrome-devtools 如何打开? 1.从浏览器菜单 ...
- 关于Google Chrome的使用小技巧!
1 1 http://www.runoob.com/w3cnote/chrome-skip.html Chrome是Google公司开发的一个现代化的网页浏览器,作为三大浏览器之一 它搭载了被称为V8 ...
随机推荐
- Mysql.linux登录数据库
//mysql -hlocalhost -uroot -p //-h数据库地址 -u用户名 -p密码 -P端口号(P大写)//-p可省略,会提示输入密码. mysql -h127. -uroot -p ...
- iocp性能分析
网络上找iocp性能分析的文章很少,因工作关系,花了点时间特意从客观数据和理论角度分析了下iocp的性能 环境 CPU i7 4核8线程 1G网卡,echo方式测试(一个客户机模拟多个客户端模式,模拟 ...
- webpack构建工具初始化并运行简单的demo
webpack官网:https://webpack.js.org/ webpack是构建工具 安装webpack的前提:node,npm要安装 初始化项目 首先是初始化项目,创建一个文件夹,并且进入文 ...
- 简单理解设计模式——享元模式-线程池-任务(tesk)
前面在写到多线程的文章的时候,一直想写一篇关于线程池等一系列的文章,做一下记录,本篇博客记录一下设计模式中享元模式的设计思想,以及使用享元模式的实现案例——线程池,以及线程池的简化版——任务(tesk ...
- ContractPattern 面向面向契约模式
- 源码的说明 ASP.NET MVC 5框架揭秘.zip
第1章 S101 MVP(SC)模式中Presenter与View之间的交互 S102 迷你版的ASP.NET MVC框架 第2章 S201 通过路由实现请求地址与.aspx页面的映射 S202 基本 ...
- 绕过路由系统 (Bypassing the Routing System)| 高级路由特性
- [转]dll反编译工具(ILSpy)的使用
软件地址: 链接:https://pan.baidu.com/s/1YunJ3MAuNisGtl8YYzr4hw 密码:ejx8 工具使方法 1.将压缩文件进行解压,打开exe文件. 2.打开后,选择 ...
- 从头学pytorch(二十二):全连接网络dense net
DenseNet 论文传送门,这篇论文是CVPR 2017的最佳论文. resnet一文里说了,resnet是具有里程碑意义的.densenet就是受resnet的启发提出的模型. resnet中是把 ...
- CAD制图系列一之绘图、标注、修改、视图
笔记内容: 缩放.平移.键盘操作 绘图:直线.矩形 修改:删除.修剪.延时 标注:线型.对齐.半径.折弯.直径.角度 知识点 鼠标中键上下滚动 平移:先全部选中,然后点击中间的空格,随便移动 重点:空 ...