为什么有些网站无法截图？

由于浏览器同源策略（CORS）限制，本工具无法对跨域网站进行截图。建议将网页内容保存为HTML文件后使用HTML预览模式截图，或使用同域网站进行测试。

截图是免费的吗？

是的，本工具完全免费，所有操作在浏览器本地完成，无需注册，数据不会上传到任何服务器。

支持哪些截图模式？

支持视口截图（仅截取当前可见区域）和全页截图（截取整个网页内容）两种模式。

在线网页截图工具 - 输入网址生成缩略图·全页/视口截图·纯前端本地处理

⚠️ 提示：由于浏览器同源策略限制，仅能对同域或允许跨域的网站截图。如无法截图，请使用「HTML 截图」模式。

<!DOCTYPE html>
<html><head><style>
body{font-family:Arial,sans-serif;padding:40px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;min-height:100vh}
h1{font-size:2.5rem;margin-bottom:10px}
p{font-size:1.1rem;opacity:.9}
.card{background:rgba(255,255,255,.1);padding:20px;border-radius:12px;margin-top:20px}
</style>
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "首页",
      "item": "https://webtools-cn.github.io/tools-site/"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "在线工具",
      "item": "https://webtools-cn.github.io/tools-site/#online-tools"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "🖼 在线网页截图工具",
      "item": "https://webtools-cn.github.io/tools-site/web-screenshot/"
    }
  ]
}
</script>
</head><body>
<h1>🎉 欢迎使用网页截图工具</h1>
<p>这是一个示例页面，您可以替换为任意 HTML 代码。</p>
<div class="card">
<h2>📸 截图演示</h2>
<p>点击「开始截图」按钮即可生成当前内容的缩略图。</p>
</div>

<div id="feedback-widget" style="position:fixed;bottom:20px;right:20px;z-index:1000">
<button id="feedback-toggle" onclick="toggleFeedback()" style="width:48px;height:48px;border-radius:50%;background:rgba(6,182,212,.2);border:2px solid rgba(6,182,212,.5);color:#22d3ee;font-size:1.2rem;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.3);transition:all .2s" onmouseover="this.style.background='rgba(6,182,212,.4)'" onmouseout="this.style.background='rgba(6,182,212,.2)'">💬</button>
<div id="feedback-panel" style="display:none;position:absolute;bottom:56px;right:0;width:320px;background:#1e293b;border:1px solid rgba(6,182,212,.3);border-radius:12px;padding:16px;box-shadow:0 8px 24px rgba(0,0,0,.4)">
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:12px">
<span style="color:#f1f5f9;font-size:.95rem;font-weight:600">📝 反馈建议</span>
<button onclick="toggleFeedback()" style="background:none;border:none;color:#64748b;font-size:1.2rem;cursor:pointer">✕</button>
</div>
<select id="feedback-type" style="width:100%;background:#0f172a;border:1px solid rgba(148,163,184,.2);border-radius:6px;padding:8px 10px;color:#e2e8f0;font-size:.85rem;margin-bottom:8px;outline:none">
<option value="feedback">💡 功能建议</option>
<option value="bug">🐛 问题反馈</option>
<option value="other">💬 其他</option>
</select>
<textarea id="feedback-text" placeholder="请描述您的建议或遇到的问题..." style="width:100%;height:100px;background:#0f172a;border:1px solid rgba(148,163,184,.2);border-radius:6px;padding:10px;color:#e2e8f0;font-size:.85rem;resize:vertical;outline:none;font-family:inherit" maxlength="1000">

0/1000