Chrome 浏览器如何“网页长截图”和“网站打包成应用”

Chrome 浏览器其实隐藏着很多极其好用的原生功能,不需要安装任何第三方插件就能轻松搞定"网页长截图"和"网站打包成应用"。

下面奉上最新版(2024年及以后)的实操指南,包教包会:

一、 谷歌网页长截图(原生免插件版)

忘掉那些臃肿的截图插件吧,Chrome 自带的命令行工具能帮你一键截取完整的网页长图,干净又清晰。

🌟 核心方法:开发者工具命令法(最推荐)

这招绝对是装杯利器,而且百分之百能截出高清完整的长图。

  1. 打开目标网页:先让页面完全加载完毕,滚动到底部确保内容都加载出来了。

  2. 唤出开发者工具 :在网页任意空白处点击鼠标右键,选择 "检查" (或者直接按下键盘上的 F12键)。

  3. 打开命令菜单 :按下快捷键 Ctrl + Shift + P ​ (Mac 系统是 Cmd + Shift + P)。

  4. 输入截图咒语 :在弹出的输入框里输入 screenshot

  5. 选择截图模式 :你会看到几个选项,用鼠标点击或者键盘上下键选择 Capture full size screenshot(捕获完整尺寸的截图)。

**🎉 完成!**​ 浏览器会稍微卡顿一下(时间取决于网页长度),随后整个网页的长图就会自动下载到你的电脑默认下载文件夹里了。

💡 附赠其他截图指令:

如果你在步骤 4 输入 screenshot后不想截全屏,还可以选择:

  • Capture screenshot:只截当前你在屏幕上看到的区域(相当于微信截图)。

  • Capture area screenshot:让你用鼠标拖拽框选任意矩形区域截图。


二、 将网站安装为应用(PWA 技术)

如果你每天都需要打开某个网站(比如 ChatGPT、Notion、或者你的工作后台),把它变成一个独立的桌面应用,不仅启动快,还能跟浏览器标签页彻底分开,体验极佳。

🌟 核心方法:通过 Chrome 菜单安装

  1. 打开你想"改造"的网站 (比如 web.telegram.orgchat.openai.com)。

  2. 打开 Chrome 右上角的"三个点"菜单

  3. 鼠标悬停在 "保存和分享"(Cast, save, and share)选项上。

  4. 在展开的子菜单中,点击 "将页面安装为应用"(Install page as app...)。

  5. 确认安装 :浏览器会弹出一个提示框,你可以给这个应用改个名字,然后点击 "安装"

**🎉 完成!**​

此时,你的电脑桌面上会生成一个该网站的独立快捷方式,并且它也会出现在你的开始菜单/应用程序文件夹里。以后双击打开,它就是一个独立的窗口,再也没有浏览器那些乱七八糟的标签页干扰你了!

💡 极速版安装通道:

现在很多现代化的网站(如 YouTube Music、WhatsApp Web 等),当你打开它们时,Chrome 地址栏的最右侧会直接显示一个 "安装"图标(长得像一个电脑屏幕加一个向下的箭头)。直接点这个图标,也能达到一模一样的效果。

相关推荐
几何心凉1 小时前
没有万能模型:我用 AiiOnly Token Plan,把多款大模型的长处拼进同一个项目
前端
kyriewen1 小时前
Claude Code 的额度今天缩水了17%——官方公告上写的是"永久提高25%"
前端·ai编程·claude
雪芽蓝域zzs2 小时前
vue解构平铺VS对象包裹
前端·javascript·vue.js
风骏时光牛马3 小时前
从零到实战,完整AI学习路线
前端
三十而立洋3 小时前
深入理解 Monorepo:子包安装依赖
前端·前端工程化
IT_陈寒3 小时前
Java Stream处理大集合,我的内存怎么就炸了
前端·人工智能·后端
Captaincc3 小时前
AI 用量桌面端-桌面宠物自定义指南
前端·人工智能
OpenTiny社区4 小时前
码力全开,智启前端新生态|OpenTiny 登陆华为全联接大会2026
前端·github
妙码生花4 小时前
利用AI从零学Go并完成实战项目,完工总结:目录结构
前端·后端·go
妙码生花4 小时前
利用AI从零学Go并完成实战项目,完工总结:商业级开源产品定位和核心特性介绍
前端·后端·go