# HTML在线编辑器 (www.htmleditor.cn)

## 网站简介
HTML在线编辑器是一个免费的在线HTML/CSS代码编辑工具，支持实时预览、语法高亮、代码模板和一键下载。无需安装，在浏览器中即可编写和预览网页代码。

## 核心功能
- 实时预览：编辑代码时右侧窗口同步显示效果
- 语法高亮：基于CodeMirror的HTML/CSS语法着色
- 15+代码模板：提供空白页面、Bootstrap卡片、登录表单等多种模板
- 设备预览：支持桌面/平板/手机三种预览尺寸
- 代码格式化：一键整理HTML代码缩进
- 自动保存：编辑内容自动保存到浏览器本地存储
- 全屏编辑：沉浸式编码体验
- 一键下载：保存为独立的HTML文件
- 查找替换：支持Ctrl+F查找和Ctrl+H替换功能
- 字体调节：可调节编辑器字体大小
- 内容分享：通过URL分享代码内容
- 行号显示：可切换编辑器行号显示
- 主题切换：深色/浅色编辑主题
- 拖拽导入：拖拽HTML文件到编辑器自动导入
- 20+在线工具：编码转换、代码压缩、开发辅助等

## 使用场景
- 前端开发快速原型制作
- HTML/CSS/JS学习练习
- 网页片段测试和调试
- 代码分享和演示
- Web前端性能优化

## 技术栈
- 后端：Go + Gin框架
- 编辑器：CodeMirror 5
- 前端：原生JavaScript
- 样式：Bootstrap 5 + Font Awesome

## 在线编辑器
- HTML在线编辑器：https://www.htmleditor.cn
- CSS在线编辑器：https://www.htmleditor.cn/css-editor
- JS在线编辑器：https://www.htmleditor.cn/js-editor
- Markdown在线编辑器：https://www.htmleditor.cn/markdown-editor

## 编码转换工具
- Base64编码解码：https://www.htmleditor.cn/base64-encoder
- URL编码解码 ：https://www.htmleditor.cn/url-encoder
- HTML实体编码：https://www.htmleditor.cn/html-encoder
- 字母大小写转换：https://www.htmleditor.cn/case-converter

## 代码优化工具
- HTML压缩：https://www.htmleditor.cn/html-minifier
- CSS压缩：https://www.htmleditor.cn/css-minifier
- JS压缩：https://www.htmleditor.cn/js-minifier
- JSON格式化：https://www.htmleditor.cn/json-formatter
- HTML表格生成器：https://www.htmleditor.cn/html-table-generator

## CSS工具
- CSS渐变生成器：https://www.htmleditor.cn/css-gradient
- CSS阴影生成器：https://www.htmleditor.cn/css-shadow
- Border Radius生成器：https://www.htmleditor.cn/border-radius
- 颜色转换工具：https://www.htmleditor.cn/color-tools

## 开发辅助工具
- 正则表达式测试：https://www.htmleditor.cn/regex-tester
- 文本差异对比：https://www.htmleditor.cn/diff-checker
- Image to Base64转换：https://www.htmleditor.cn/image-to-base64

## 实用工具
- 密码生成器：https://www.htmleditor.cn/password-generator
- UUID生成器：https://www.htmleditor.cn/uuid-generator
- 时间戳转换：https://www.htmleditor.cn/timestamp-converter
- Lorem Ipsum生成器：https://www.htmleditor.cn/lorem-ipsum

## 学习资源
- 开发博客：https://www.htmleditor.cn/blog
- HTML速查表：https://www.htmleditor.cn/html-cheatsheet
- CSS速查表：https://www.htmleditor.cn/css-cheatsheet
- JS速查表：https://www.htmleditor.cn/js-cheatsheet
- HTML入门指南：https://www.htmleditor.cn/blog/html-basics-guide
- CSS布局教程：https://www.htmleditor.cn/blog/css-layout-techniques
- JS基础教程：https://www.htmleditor.cn/blog/javascript-fundamentals

## 其他页面
- 关于我们：https://www.htmleditor.cn/about
- 隐私政策：https://www.htmleditor.cn/privacy
- 服务条款：https://www.htmleditor.cn/terms
- 联系我们：https://www.htmleditor.cn/contact
- 在线工具集：https://www.htmleditor.cn/tools
- 站点地图：https://www.htmleditor.cn/sitemap.xml

## 最后更新
2026-07-10