第一步：打开chrome开发者工具。

打开你想截图的网页，然后按下 F12（macOS 是 option + command + i）调出开发者工具，接着按「Ctrl + Shift + P」（macOS 是 command + Shift + P）。紧接着输入指令 capture，它会提示有三个选项，如下图所示：

分别是截取全屏、node 模式以及当前范围，用鼠标点击或者用键盘选择对应的就可以了。

利用Chrome开发者工具功能进行网页整页截图的方法的更多相关文章

  1. 一、Google开发者工具功能页面截图

    一.利用Chrome开发者工具功能进行网页整页截图的方法. 打开你想截图的网页,然后按下 F12(macOS 是 option + command + i)调出开发者工具, 接着按「Ctrl + Sh ...

  2. 使用 Chrome 开发者工具进行 JavaScript 问题定位与调试

    转自:https://www.ibm.com/developerworks/cn/web/1410_wangcy_chromejs/ 引言 Google Chrome 是由 Goole 公司开发的一款 ...

  3. Chrome开发者工具之测试应用

    一.Chrome开发者工具简介 浏览器的开发者工具(DevTools)可以帮助开发人员对网页进行布局,比如HTML+CSS,帮助前端工程师更好的调试脚本(JavaScript.jQuery)之类的,还 ...

  4. Chrome开发者工具中Elements(元素）断点的用途

    SAP Engagement Center UI的这个按钮会每秒钟刷新一次,显示页面已经打开了多长时间. 需求:需要找到哪行JavaScript代码不断刷新的按钮文字. 按照经验判断,这个文字肯定是一 ...

  5. 使用Chrome开发者工具调试Android端内网页(微信，QQ，UC，App内嵌页等)

    使用Chrome开发者工具调试Android端内网页(微信,QQ,UC,App内嵌页等) 前言 移动端页面调试一直是好多朋友头疼的问题,iOS 由于其封闭的特性和整体较高的性能,整体适配相对好做,调试 ...

  6. 爬虫 Http请求,urllib2获取数据,第三方库requests获取数据,BeautifulSoup处理数据,使用Chrome浏览器开发者工具显示检查网页源代码,json模块的dumps，loads，dump，load方法介绍

    爬虫 Http请求,urllib2获取数据,第三方库requests获取数据,BeautifulSoup处理数据,使用Chrome浏览器开发者工具显示检查网页源代码,json模块的dumps,load ...

  7. （转）Chrome开发者工具不完全指南（一、基础功能篇）

    本篇转载自卖烧烤夫斯基,并做了小部分的修改. 原文地址:Chrome开发者工具不完全指南(一.基础功能篇) 原作者:卖烧烤夫斯基 就算你不是一名前端开发工程师,相信你也不会对Chrome浏览器感到陌生 ...

  8. Chrome开发者工具不完全指南：（三、性能篇）

    卤煮在前面已经向大家介绍了Chrome开发者工具的一些功能面板,其中包括Elements.Network.Resources基础功能部分和Sources进阶功能部分,对于一般的网站项目来说,其实就是需 ...

  9. Chrome开发者工具详解(5)-Application、Security、Audits面板

    Chrome开发者工具详解(5)-Application.Security.Audits面板 这篇文章是Chrome开发者工具详解这一系列的最后一篇,介绍DevTools最后的三个面板功能-Appli ...

随机推荐

  1. Python-警告处理

    python 下Warning的使用 起因是这样的,当我使用pymysql模块执行建表的sql语句时获,在控制台输出了红色的消息,但是程序并没有终止而是继续运行了 sql语句如下: CREATE TA ...

  2. 移动应用性能测试剖析以及PerfDog与其他工具的对比分析11.22

    商业转载请联系腾讯WeTest获得授权,非商业转载请注明出处. 导语: 在IT.互联网及游戏行业,软件测试都是一个重要且不可或缺的过程,测试是软件生命周期中的一个重要阶段,是软件质量保证的关键步骤.目 ...

  3. node设置跨域白名单

    // 判断origin是否在域名白名单列表中 function isOriginAllowed(origin, allowedOrigin) { if (_.isArray(allowedOrigin ...

  4. 论文学习-wlg-基于二维材料的肖特基异质结构的通用尺度定律

    目录 主要公式: 各个段落的内容 第一页 第二页 第三页 名词的含义 功函数: 电子亲和力 肖特基势垒 肖特基二极管的原理 非相对论性电子气:未知 Rashba自旋电子系统: 参考链接: 主要公式: ...

  5. JavaScript—Json操作

    https://www.cnblogs.com/jimmyshan-study/p/11229373.html https://www.cnblogs.com/cailijuan/p/10150918 ...

  6. [Go] gocron源码阅读-go语言的结构体

    结构体类型 type 名字 struct{},下面这段是github.com/urfave/cli包里的代码,声明了一个App的结构体类型 type App struct { // The name ...

  7. [PHP] 新版本PHP7.4与新版本MySQL8认证问题

    mysql8的默认密码加密方式是caching_sha2_password,PHP7.4连接mysql的加密方式也为caching_sha2_password,这个地方要注意. 当为了兼容旧版的客户端 ...

  8. 安全类和远程类shell脚本

    批量杀php小马脚本 find /home/hatdot/ -name "*.php" |xargs egrep "phpspy|c99sh|milw0rm|eval\( ...

  9. 【cf600】E. Lomsat gelral（dsu on tree）

    传送门 题意: 求子树众数. 思路: \(dsu\ on\ tree\)模板题,用一个桶记录即可. 感觉\(dsu\ on\ tree\)这个算法的涉及真是巧妙呀,保留重链的信息,不断暴力轻边,并且不 ...

  10. Linux学习（一）简介

    Linux 简介 Linux 内核最初只是由芬兰人林纳斯·托瓦兹(Linus Torvalds)在赫尔辛基大学上学时出于个人爱好而编写的. Linux 是一套免费使用和自由传播的类 Unix 操作系统 ...