在线 HTML 编辑器可以做什么？
WH网站在线 HTML 编辑器用于直接修改现有 HTML 页面。你可以上传本地 .html 或 .htm 文件，也可以粘贴完整 HTML 源码，然后在可视化页面中查看网页实际效果。选中需要调整的内容，在右侧修改文字、图片地址、链接和常用样式，完成后下载新的 HTML 文件。
与只提供代码输入框的 HTML 源码编辑器不同，本工具同时提供可视化编辑和源码编辑两种方式。需要换一行标题时，可以直接在网页上操作；需要改标签结构或整段样式时，可以切换源码模式。两种方式使用同一份页面内容，适合在修改过程中来回检查。
- 修改已有 HTML 网页、AI 生成的 HTML 和静态页面文字。
- 替换图片，调整链接地址、按钮文字和打开方式。
- 修改 CSS 颜色、尺寸、边框和间距，查看 HTML 渲染效果。
- 撤销或重做修改，复制完整源码，下载修改后的 HTML。
这里处理的是你已有的页面文件，不提供网站发布或云端项目管理。原页面的结构与资源写法会影响预览结果，尤其是依赖脚本、构建工具或服务器的数据页面。
上传 HTML 文件直接可视化修改
点击工具栏中的“上传 HTML”，选择电脑中的 .html 或 .htm 文件。文件读取后会显示在独立预览区域，你可以通过点选元素进行 HTML 文件编辑，不必先定位某一行源码。原文件不会被直接覆盖，下载时会生成一份修改后的文件。
如果内容来自聊天窗口、邮件或代码片段，使用“粘贴 HTML”即可。完整 HTML 文档可以包含文档声明、页面头部、样式和正文；HTML 片段则会补充必要的文档结构。内嵌 CSS、style 标签、行内样式、远程图片和 data:image 图片均可参与预览。
进行 HTML 在线修改前，建议保留原始文件。单个 HTML 不等于完整网站目录：引用的图片、字体与外部样式不会随文件自动导入。资源使用相对路径时，工具会显示提示；将地址改成可访问的完整 URL，或嵌入本地图片，可以解决部分显示问题。
直接修改网页文字、图片和链接
在线修改 HTML 文字
双击标题、段落、文字片段、链接、按钮、列表项或表格单元格，即可进入文字编辑状态。单行内容按 Enter 保存，多行内容按 Ctrl+Enter 保存，也可以点击外部结束编辑。右侧的文字输入框适合替换一整段内容。修改包含多个子标签的区块前，应先选中具体文字元素，避免误改内部结构。
在线替换 HTML 图片
点击图片后，可以填写新的图片地址、替代文字及图片链接。选择本地图片时，工具将图片转换为 Data URL 写入当前文档，立即更新预览。替代文字用于描述图片内容，图片无法加载或读屏时仍能提供信息。嵌入图片方便单文件传递，但会增加 HTML 体积，建议先压缩过大的原图。
在线修改 HTML 链接
选中链接，在属性面板修改链接文字、链接地址和打开方式。可以设置当前窗口打开或新窗口打开，图片也可以添加链接。编辑区域中的点击用于选中元素，实际跳转受到预览隔离限制。完成后下载页面，再在正常网页环境中检查目标地址和跳转效果。
HTML 源码编辑与实时预览
点击“源码模式”查看完整 HTML。源码编辑区域提供语法高亮、行号、查找、替换与 HTML 格式化，方便定位重复文字、修改属性或整理缩进。HTML 源码编辑器适合精确调整标签与样式，尤其是可视化属性面板没有对应字段的内容。
源码修改会同步到预览，切换回可视化模式后可以继续点选元素；可视化修改也会反映在完整源码中。HTML 实时预览帮助你确认渲染结果，但格式化只整理代码，不会自动修复设计问题。浏览器会尝试解析不完整的标签，因此请对照预览检查结构，而不是只看代码是否有颜色。
桌面、平板和手机按钮改变的是预览宽度，平板为768px，手机为390px，不会改写页面自身的宽度设置。通常所说的 HTML 运行、HTML 在线预览或代码预览，在这里指浏览器渲染 HTML 与 CSS。导入页面中的 JavaScript 默认不会执行，依赖脚本产生的内容可能为空。
在线修改 HTML CSS 样式
选中元素后，右侧“样式设置”可调整文字颜色、背景颜色、字体大小、粗细、对齐、行高和字间距。边框颜色、宽度、样式及圆角适合修改按钮和卡片；宽度、高度、最大宽度与最小高度则用于控制元素尺寸。尺寸根据字段支持像素、百分比或自动值。
内边距是内容与元素边界之间的距离，外边距是元素与周围内容之间的距离，两者分别对应 CSS 的 padding 和 margin。上、右、下、左可以单独修改。做网页样式修改时，先调整一个方向再观察效果，通常比一次修改所有数值更容易判断原因。
默认安全编辑提供常用字段，高级编辑会额外开放布局属性并先显示提示。CSS 在线编辑的结果仍受原页面样式优先级和父级布局影响，例如固定宽度或带有 !important 的规则可能覆盖期望效果。需要深入调整时，切换源码模式查看相关选择器，修改后同时检查桌面与窄屏排版。
适合修改 AI 生成的 HTML 页面
使用 ChatGPT、Claude 或 Codex 生成 HTML 后，往往只需要换标题、替换图片、调整颜色、修改按钮链接或缩小区块间距。把完整代码粘贴进工具，或上传保存好的 HTML 文件，可以直接针对这些细节进行二次修改，不必每次重新生成整页。
载入前应去掉聊天回复中的解释文字及代码围栏，只保留页面代码。如果生成结果是框架组件、项目工程文件或需要编译的模板，不能直接作为普通 HTML 使用。本工具处理浏览器可解析的 HTML 文档，与 ChatGPT、Claude、Codex 及其提供方没有官方合作关系。
为什么使用浏览器本地 HTML 编辑？
核心编辑过程在当前浏览器中完成。文件读取、页面解析、元素修改和 HTML 下载无需安装软件、注册账号或把 HTML 通过编辑接口上传到服务器。对于临时调整本地页面，这样的流程可以减少来回传递文件的步骤。
本地处理也有实际边界：页面里的远程图片、字体和样式表仍可能向对应服务器发起请求。自动保存使用当前浏览器的本地存储，不会跨设备同步，隐私模式、存储容量或手动清理都可能影响草稿。涉及重要内容时，请保留原文件并及时下载修改版本。
如何在线修改 HTML 文件？
1. 上传或粘贴 HTML
通过“上传 HTML”选择本地文件，或点击“粘贴 HTML”载入代码。先检查整体页面是否显示正常；如果提示相对资源路径，确认图片与样式地址是否需要替换。
2. 在网页中选择内容
在可视化模式点击文字、图片、链接、表格等元素，蓝色边框标记当前选择。右侧显示中文元素名称和对应 HTML 标签，便于确认选中的是内容本身还是外层区块。
3. 修改内容或 CSS 样式
双击文字直接编辑，或在属性面板修改内容和样式。需要复制、删除、上移或下移元素时使用元素操作；删除前会请求确认。工具保留最多50个文档历史快照，可撤销和重做近期修改。
4. 实时检查页面
观察修改后的预览，并切换平板与手机宽度检查换行、间距和表格。源码模式适合检查完整代码。预览宽度只是排版参考，不能代替实际设备中的字体、触摸与浏览器测试。
5. 下载修改后的 HTML
点击“下载 HTML”生成完整文档，或通过“复制源码”保存代码。导出后检查资源地址和链接，再用于原来的静态网站环境。导入的原始脚本会保留，普通浏览器打开下载文件时可能运行这些脚本。
HTML 可视化编辑器与源码编辑器有什么区别？
两种方式解决不同的操作需求，可以按当前任务选择，也可以在同一次编辑中配合使用。可视化适合从页面实际效果定位元素，源码适合检查标签关系和精确修改代码。
| 功能 | 可视化 HTML 编辑 | HTML 源码编辑 |
|---|---|---|
| 修改文字 | 双击内容或使用属性面板 | 定位标签中的文字 |
| 修改图片 | 选中图片并替换地址或本地图片 | 修改图片标签属性 |
| 修改链接 | 填写链接地址与打开方式 | 修改链接标签属性 |
| 修改 CSS | 通过常用样式字段调整 | 修改任意样式规则 |
| 查看 HTML 标签 | 查看当前元素标签名称 | 查看完整文档结构 |
| 精确修改代码 | 围绕所选元素进行操作 | 直接编辑标签、属性和样式 |
| 适合普通用户 | 从页面内容入手调整 | 需要理解基本代码写法 |
| 适合开发人员 | 快速检查和调整页面细节 | 处理结构与复杂样式 |
支持哪些 HTML 内容？
支持 HTML5、.html 和 .htm 文件、HTML 片段、内嵌 CSS、style 标签、行内样式，以及文字、图片、链接、表格、列表和按钮等常见内容。表单、输入框和下拉框可以显示并选择，data:image 图片可直接嵌在文档中。
外部 CSS、图片和字体依赖其 URL、网络与访问规则。相对路径可能失效，工具不会自动寻找电脑上的其他文件，也不会将资源目录打包。导入页面放在隔离的预览区域中，JavaScript 出于安全原因默认不会执行，表单提交和部分交互也受到限制。
下载保留完整文档结构及原始脚本，不包含编辑器的选择标记。需要交付可独立打开的页面时，应检查全部资源是否已嵌入或可访问；需要部署到原网站时，应保留原有目录结构，并在目标环境再次检查。