中添加以避免乱码；3. 推荐使用vs code等代码编辑器进行编辑，因其支持语法高亮、自动补全和插件扩展；4. 一个最简单的html文件包含doctype声明、html根元素、head头部（含字符集和标题）和body主体（含标题和段落），保存后用浏览器打开即可显示内容。<p>
<p>HTML文件通常保存为
.html
或
.htm
扩展名，这两种都是网页的默认扩展名，用于标识该文件是超文本标记语言文档。
解决方案
<p>保存HTML文件其实是个很简单，但又容易被新手忽略细节的步骤。你通常会用到一个文本编辑器，比如windows自带的记事本、macos的TextEdit，或者更专业的如VS Code、sublime Text、Notepad++等。关键在于“另存为”的时候，确保文件类型选择“所有文件”或者“All Files”，然后手动输入文件名，并在文件名后面加上
.html
或
.htm
。举个例子，你想保存一个名为“我的主页”的文件，就输入“我的主页.html”。
<p>还有一点非常重要，就是编码。多数情况下，我们都应该选择UTF-8编码。这能最大程度地避免网页显示乱码的问题，尤其当你的内容包含中文或其他非英文字符时。很多编辑器在保存时会默认UTF-8，但检查一下总没错。如果你用的是记事本，它在“另存为”对话框的底部就有编码选项。
<p>立即学习“前端免费学习笔记（深入）”；
为什么我的HTML文件打开后显示乱码？
<p>这几乎是每个初学者都会遇到的一个“坑”。当你辛辛苦苦写完一段HTML代码，用浏览器打开却发现文字变成了一堆方块或者奇怪的符号，那多半是编码问题。这就像你用一套语言写了封信，收信人却拿了另一套语言的字典来解读，自然就对不上了。
<p>HTML文件本身并没有自带字符集信息，或者说，它需要你明确告诉浏览器它使用的是哪种字符集。最常见的乱码原因就是文件保存时使用的编码（比如ANSI或GB2312）与浏览器解析时默认的编码（通常是UTF-8，或者浏览器根据系统设置猜测的编码）不一致。
<p>要解决这个问题，核心就是统一。在你的HTML文件的
<head>
标签内，加入一行元数据（meta tag）来声明文档的字符集，例如：
<meta charset="UTF-8">
这行代码告诉浏览器：“嘿，我这个文件是用UTF-8编码写的，你得用UTF-8来解析它！”
<p>同时，在保存文件时，也要确保你的文本编辑器确实是以UTF-8编码来保存的。很多高级编辑器都会在状态栏显示当前文件的编码，并且在“另存为”时提供编码选项。保持文件内部声明和文件实际保存编码的一致性，乱码问题基本就能迎刃而解了。
除了文本编辑器，还有哪些工具可以创建和编辑HTML文件？
<p>当然，记事本这类纯文本编辑器虽然能写HTML，但效率和体验上就差强人意了。就像用铅笔画素描，虽然能画，但总归不如专业的绘画工具来得顺手。
<p>对于HTML的创建和编辑，选择其实非常多样：
<p>首先，代码编辑器是主流。像visual studio Code (VS Code)、sublime text、Notepad++这些，它们提供了语法高亮（让不同标签、属性、文本显示不同颜色，一眼就能看出代码结构）、自动补全、代码片段、集成终端、丰富的插件生态等功能。比如，在VS Code里安装Emmet插件，你输入
!
然后按Tab键，就能快速生成一个html5的基本结构，效率提升不止一点点。它们本质上还是文本编辑器，但针对编程做了大量优化，是前端开发者的首选。
<p>其次，集成开发环境（ide）。这类工具功能更强大，除了代码编辑，还可能集成了版本控制、调试、项目管理等一整套解决方案。比如webstorm，它对前端开发的支持非常全面，智能提示、重构功能都非常强大。不过，对于仅仅是编辑HTML文件而言，IDE可能显得有些“杀鸡用牛刀”，资源占用也相对较高。
<p>最后，还有一些在线编辑器或代码沙盒。比如CodePen、JSFiddle、Glitch等。它们的好处是无需安装任何软件，打开浏览器就能直接编写、预览HTML、css和JavaScript代码，并且可以方便地分享给他人。对于快速测试、分享代码片段或者进行一些小练习来说，它们非常方便。
<p>选择哪种工具，很大程度上取决于你的需求和熟练程度。初学者从VS Code这类代码编辑器开始是个不错的选择，它们功能强大又相对轻量。
一个最简单的HTML文件长什么样？
<p>一个最最简单的HTML文件，其实就是几行代码，但它们构成了网页的基本骨架。它看起来可能像这样：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>我的第一个网页</title> <body> <h1>你好，世界！<p>这是一个简单的HTML页面。
