HTML文件显示源码而非渲染，通常因扩展名错误或服务器返回text/plain类型。1. 确保文件保存为.html后缀，非.html.txt；2. 通过浏览器打开文件，使用file://协议；3. 用代码编辑器将文件编码设为UTF-8无BOM；4. 若使用本地服务器，确保响应头Content-Type为text/html；5. 检查HTML结构完整性，包含等基本标签；6. 清除缓存或换浏览器测试，排除缓存或插件影响。多数问题由扩展名错误或MIME类型不当引起，正确配置即可正常渲染。
HTML 文件在浏览器中显示源码而不是正常渲染页面，通常是因为文件没有被当作 HTML 解析，而是被当作纯文本处理了。这种情况常见于本地打开文件、服务器配置错误或文件编码问题。下面列出几种常见原因及解决方法：
1. 检查文件扩展名是否为 .html
确保你的文件保存为 .html 后缀，例如：index.html。如果保存成 .txt（如 index.html.txt），浏览器会识别为文本文件。
- 在 Windows 中，启用“显示文件扩展名”功能，检查真实后缀
- 重命名文件，去掉多余的 .txt 后缀
2. 正确使用本地文件协议（file://）
双击 HTML 文件或通过浏览器菜单“打开文件”来加载本地页面，不要用文本编辑器直接打开。
- 右键 HTML 文件 → 打开方式 → 选择浏览器（Chrome、Edge 等）
- 或手动拖拽文件到浏览器标签页中
3. 检查文件编码格式（推荐 UTF-8）
虽然编码错误一般不会导致只显示源码，但不正确的 BOM 或编码可能影响解析。
立即学习“前端免费学习笔记（深入）”；
- 使用代码编辑器（如 VS Code、Notepad++）将文件另存为 UTF-8 编码（无 BOM）
- 避免使用 ANSI 或其他非标准编码保存网页文件
4. 确保服务器正确返回 MIME 类型
如果你是通过本地服务器（如 XAMPP、Node.js、Python HTTP 服务）运行，服务器必须返回正确的 Content-Type。
- 正确类型应为 text/html
- 若服务器返回 text/plain，浏览器会按纯文本显示源码
- 检查服务器配置或脚本是否设置了错误的响应头
例如，用 Python 启动服务时，应使用：
python -m http.server 8000
而不是简单的文本服务器。
5. 检查 HTML 结构是否完整
极简结构缺失也可能导致异常解析（虽少见）。
- 确保有基本结构：
- 缺少 DOCTYPE 可能触发浏览器怪异模式，但一般不会显示源码
6. 清除浏览器缓存或换浏览器测试
某些浏览器可能因缓存或插件误判文件类型。
- 尝试使用 Chrome、Firefox 或 Edge 新建无痕窗口打开
- 清除缓存后重试
基本上就这些。多数情况下是文件扩展名错误或服务器返回了 text/plain 类型导致的。只要确保是 .html 文件并通过正确方式打开，就能正常渲染。
