【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 视图/触发器/函数
一.视图 作用:简写代码,与临时表的作用差不多 .创建 create view 视图名 as SQL语句 .修改 alter view 视图名 as 新SQL语句 .删除 drop view 视图名 ...
- JS ES6补充
补充点:1.let const 2.字符串模板 3.箭头函数 4.对象的单体模式 5.面向对象 一.定义变量 A.var 特点: 1.定义全局变量 2.可以重复定义 3.变量名提升 <!DOC ...
- Spring Cloud Contract 微服务契约测试
简介 使用场景 主要用于在微服务架构下做CDC(消费者驱动契约)测试.下图展示了多个微服务的调用,如果我们更改了一个模块要如何进行测试呢? 传统的两种测试思路 模拟生产环境部署所有的微服务,然后进行测 ...
- 公司项目redis 项目报错 记事
异常内容: Timeout performing GET Key_CacheHSCode, inst: 1, mgr: ExecuteSelect, err: never, queue: 2, qu ...
- 使用FileZilla Pro S3协议访问七牛云对象存储
偶然发现FileZilla还有Pro版本,主要是比免费版多了一些协议支持,也偶然发现七牛云支持了S3协议接口,这样刚好弥补了其没有FTP的不足,于是找官方文档,折腾一下,使用FileZilla Pro ...
- Nginx-Http服务器常用配置
#运行用户 user nobody; #启动进程,通常设置成和cpu的数量相等 worker_processes 1; #全局错误日志及PID文件 #error_log logs/error.log; ...
- Leetcode 题目整理 climbing stairs
You are climbing a stair case. It takes n steps to reach to the top. Each time you can either climb ...
- vim 实用快捷键
删除当前行:dd 删除上一行:dj 删除下一行:dk 拷贝当前行:yy 交换当前行和其下一行 交换当前字符和其后的一个字符 剪切当前字符:x 剪切当前光标开始向后三个字符:3x 撤销最近一次修改:u ...
- mybatis从数据库中取数据且分组,返回分组数据
mapper.xml文件 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PU ...
- 技术派-github常见的一些用法和缩写
PR: Pull Request. 拉取请求,给其他项目提交代码 LGTM: Looks Good To Me. 看起来不错,代码已 review,可以合并 SGTM: Sounds Good To ...