HTML 查看 — 实时 HTML 预览在线
粘贴 HTML 和查看它 rendered 实时在一 sandboxed 预览.
最后更新：
HTML 查看 — 实时 HTML 预览在线
使用这免费 HTML 查看在线到粘贴或 write HTML 代码和立即查看如何它 looks 在浏览器.
那里是否需要到创建一 .html 文件, install 软件, 或设置上一开发 environment.
工作流是简单:
粘贴 HTML → 查看实时预览
作为您 edit 代码, 预览更新自动所以您可以测试 layouts, HTML snippets, 表单, tables, inline CSS, 和网站部分快速.
如何到使用 HTML 查看
- 粘贴或类型 HTML 到 HTML 代码编辑器.
- 查看 rendered 结果在实时预览 panel.
- Continue 编辑和查看变化自动.
- 切换之间桌面, Tablet, 和移动端预览大小.
- 复制或下载您的 HTML 何时完成.
您可以也使用样本按钮如果您想要到测试查看之前添加您的自己的代码.
HTML 预览示例
粘贴:
[object HTMLPreElement]预览 panel 立即 renders heading, paragraph, 和按钮.
您可以使用任一小 HTML fragments 或完整 HTML 文档.
实时 HTML 预览同时您类型
与自动预览 enabled, 那里是否需要到 press 一 Run 按钮之后每 edit.
更改:
- HTML elements
- 文本
- Classes
- Inline 样式
- Tables
- 表单
- 图像
- Layout 结构
和 rendered 结果更新自动.
如果您是工作与更大 HTML 代码, 您可以 turn 自动预览关闭和使用 Refresh 预览手动.
HTML 编辑器与预览
在桌面, 工具显示:
HTML 编辑器 | 实时预览
这使它简单到比较您的源代码与 rendered 输出.
在更小 screens, 编辑器和预览自动 stack vertically 用于更容易使用在 tablets 和移动端设备.
测试 HTML 在线
查看是有用何时您需要到快速测试一小 piece 的 HTML 无打开一完整 IDE.
常见使用包括:
- 测试 HTML snippets
- 检查生成的 HTML
- 预览博客 HTML
- 测试 tables
- 审查表单
- 检查 inline CSS
- Debugging layout problems
- 预览网站部分
- Learning HTML
- Demonstrating HTML 在教室
Responsive HTML 预览
使用 built-在设备控制到查看如何您的 HTML behaves 在不同 viewport 宽度.
选择从:
桌面
预览页面在一 wide 桌面 layout.
Tablet
检查如何 HTML responds 在一 narrower tablet 宽度.
移动端
预览 layout 在一移动端-大小 viewport.
这是尤其 helpful 何时测试 responsive CSS 和网站部分.
预览 HTML 和 CSS
HTML 查看支持 CSS 位置 inside 您的代码.
例如：
[object HTMLPreElement]样式将 appear 直接在预览.
您可以使用:
-
Internal
<style>blocks - Inline 样式
- 基础 responsive CSS
- External stylesheets 何时浏览器访问允许它们
HTML Fragment 和完整文档支持
您做不需要到 write 一完整 HTML 文档.
一简单 fragment 此类作为:
[object HTMLPreElement]可以是预览立即.
您可以也粘贴一完整文档包含:
[object HTMLPreElement]这使工具有用用于两者 beginners 和开发者.
Safe HTML 预览
预览运行 inside 一 isolated iframe.
用于 safety, JavaScript execution 是 disabled 在这 version 的查看.
HTML 和 CSS 可以是 rendered, 同时 potentially risky active behavior 此类作为 scripts, 表单 submissions, popups, 和 nested frames 是 restricted.
这使工具更好 suited 用于快速 inspecting 过去 HTML 无 allowing 它到 interact 直接与主要工具页面.
Import 和下载 HTML
如果您已经有一 HTML 文件, 使用 Import HTML 到 load 它到编辑器.
何时完成, 点击下载到保存当前代码作为一 .html 文件.
这适用于：
- 学生创建 HTML 练习
- 开发者测试 snippets
- Bloggers 审查 HTML
- 教师准备示例
- Freelancers 检查客户标记
复制 HTML 与一点击
使用复制 HTML 到快速复制完整源代码到您的 clipboard.
您可以然后粘贴它到:
- 对比代码
- 一 CMS
- 一网站 builder
- 一博客编辑器
- 一代码 repository
- 另一个开发工具
谁是这 HTML 查看用于?
Front-结束开发者
快速测试和 debug HTML 无创建 temporary 文件.
学生
Learn HTML 通过写作代码和查看结果立即.
Beginners
Experiment 与 headings, paragraphs, 按钮, 表单, 图像, 和样式.
问答 Testers
Inspect 生成的或已复制 HTML 和验证如何它 renders.
Bloggers
预览自定义 HTML 之前添加它到一网站或 CMS.
教师
Demonstrate HTML 示例在一简单浏览器-基于 environment.
常见问题
什么是一 HTML 查看?
一 HTML 查看允许您输入 HTML 代码和查看 rendered 视觉结果在一浏览器预览.
可以我预览 HTML 在线无创建一文件?
是. 粘贴或类型您的 HTML 直接到编辑器和查看结果立即.
会预览更新自动?
是. 自动预览更新 rendered 输出同时您类型.
可以我预览 CSS 也?
Yes. Inline CSS and <style> blocks are rendered with the HTML.
可以我测试 responsive HTML?
是. 使用桌面, Tablet, 和移动端预览模式.
可以我粘贴一完整 HTML 文档?
是. 两者 HTML fragments 和完整文档是支持.
会 JavaScript run 在预览?
否. JavaScript 是 disabled 在这 version 用于 safer HTML 预览.
可以我下载我的 HTML?
是. 您可以下载当前源作为一 .html 文件.
预览 HTML 在线现在
粘贴您的 HTML 到编辑器和查看 rendered 结果立即.
是否您是 learning HTML, 测试一 snippet, 检查一 responsive layout, 审查生成的代码, 或 debugging 一网站部分, 这实时 HTML 查看给出您一快速方式到预览 HTML 直接在浏览器中.