# 网站截图器

使用无头浏览器生成高质量网站截图，支持自定义选项

> 标准页面: https://elysiatools.com/zh/tools/website-screenshot

- **分类:** Development

- **关键词:** 截图, 网站, 浏览器, puppeteer, 捕获, 网页, 图像, 无头, 自动化

## 概述

网站截图器是一款基于无头浏览器的在线工具，能够快速、高质量地捕获网页截图。您只需提供目标网址，即可自定义截图尺寸、格式、质量，并支持整页截图、隐藏干扰元素、模拟暗黑模式或移动视图等多种高级选项。

## 输入项

- **URL** (text): https://example.com
- **宽度（像素）** (number): 1200
- **高度（像素）** (number): 800
- **图像格式** (select)
- **质量（1-100）** (number): 80
- **整页截图** (checkbox)
- **等待时间（毫秒）** (number): 1000
- **隐藏元素（CSS选择器）** (textarea): .ads, .popup, .cookie-banner (comma-separated)
- **暗黑模式** (checkbox)
- **移动视图** (checkbox)

## 适用场景

- 需要快速捕获并保存某个网页的当前视觉状态时。
- 需要特定尺寸（如用于社交媒体封面）或特定格式（如WebP）的网页截图时。
- 需要自动化截图流程，或需要隐藏网页上的广告、弹窗等元素以获得干净截图时。

## 工作原理

- 在输入框中粘贴或输入您想要截图的完整网页URL。
- 根据需要配置截图选项，如设置宽度和高度、选择图像格式（PNG/JPEG/WebP）、调整质量、启用整页截图或隐藏特定元素。
- 点击生成按钮，工具将启动无头浏览器访问该页面并按照您的设置进行截图。
- 截图生成后，您可以直接预览并下载图像文件。

## 使用案例

- 网页设计师保存设计灵感或记录页面改版前后的状态。
- 内容运营人员为文章或报告捕获特定网页的快照作为参考资料。
- 开发或测试人员自动化生成不同设备视图下的页面截图，用于回归测试或文档记录。

## 常见问题

### 支持哪些图像格式？

支持 PNG（无损）、JPEG（有损压缩）和 WebP（现代格式）三种格式。

### 什么是“整页截图”？

启用后，工具会捕获整个可滚动页面的完整长度，而不仅仅是当前屏幕可见区域。

### “隐藏元素”功能怎么用？

在文本框中输入一个或多个CSS选择器（用逗号分隔），例如 `.ads, .popup`，工具会在截图前隐藏匹配的页面元素。

### 可以模拟手机浏览效果吗？

可以。勾选“移动视图”选项，工具会模拟移动设备的屏幕尺寸和用户代理来生成截图。

### “等待时间”有什么用？

对于加载缓慢或有动态内容的页面，增加等待时间（毫秒）可以确保页面元素完全加载后再截图，避免截取到空白或未渲染的内容。

## 相关工具

- [红青3D立体图生成器](https://elysiatools.com/zh/tools/image-anaglyph): 从普通照片生成红青3D立体图。创建可使用红青3D眼镜观看的立体3D图像。
- [深度图生成器](https://elysiatools.com/zh/tools/image-depth-map): 从图像生成深度图，使用亮度、饱和度和边缘分析。生成灰度深度图，较亮像素表示较近物体，较暗像素表示较远物体。
- [PDF品牌手册](https://elysiatools.com/zh/tools/pdf-brand-guidelines-pdf): 生成包含Logo、色板、字体和间距规范的品牌手册PDF
- [PDF图片布局](https://elysiatools.com/zh/tools/pdf-image-layouts): 单页多图布局（九宫格/瀑布流/画廊）
- [PDF摄影接触表](https://elysiatools.com/zh/tools/pdf-photo-contact-sheet): 按网格生成缩略图接触表，并附带文件名与EXIF信息
- [PDF海报制作](https://elysiatools.com/zh/tools/pdf-poster-maker): 海报/宣传单模板生成PDF
- [PDF分镜脚本纸](https://elysiatools.com/zh/tools/pdf-storyboard-sheet): 生成带缩略图和描述区域的分镜脚本纸
- [VP8 图像分析器](https://elysiatools.com/zh/tools/vp8-image-analyzer): 使用 Sharp 分析 WebP/VP8 图像，生成灰度位移图，并用 Three.js 渲染可旋转的 3D 浮雕表面

## 示例

- [Android Java 图像处理示例](https://elysiatools.com/zh/samples/android-image-processing-java): Android Java 图像处理示例，包括图像读取保存、缩放和格式转换
- [Android Kotlin 图像处理示例](https://elysiatools.com/zh/samples/android-image-processing-kotlin): Android Kotlin 图像处理示例，包括图像读取保存、缩放和格式转换
- [Web Python 图像处理示例](https://elysiatools.com/zh/samples/web-image-processing-python): Web Python 图像处理示例，使用 PIL/Pillow 包括读取、保存、缩放和格式转换
- [Web Rust 图像处理示例](https://elysiatools.com/zh/samples/web-image-processing-rust): Web Rust 图像处理示例，包括图像读取保存、缩放和格式转换

## 相关内容

- [网页发布前无障碍审查](https://elysiatools.com/zh/hubs/web-accessibility-audits): 检查网页或 UI 组件的结构、阅读顺序、截图对比度和色觉风险，并把自动发现整理成由人工复核的发布记录。