HTML 教程 / HTML编辑器

HTML 编辑器

学习如何使用简单的文本编辑器编写HTML代码，并在浏览器中查看效果。

使用记事本编写 HTML

Windows系统自带的记事本就可以用来编写HTML代码，非常适合初学者。

步骤一：打开记事本

点击 开始菜单 → 程序 → 附件 → 记事本

或者按 Win + R 键，输入 notepad 后回车。

步骤二：编写代码

在记事本中输入以下代码：

index.html 
<!DOCTYPE html>
<html>
<head>
    <title>我的第一个网页</title>
</head>
<body>
    <h1>欢迎访问我的网站</h1>
    <p>这是用记事本编写的第一个网页</p>
</body>
</html>

步骤三：保存文件

  1. 点击菜单 文件 → 另存为
  2. 在"文件名"输入框中填写 index.html
  3. 在"保存类型"中选择 所有文件(*.*)
  4. 点击保存按钮
注意

文件名一定要以 .html 或 .htm 结尾，否则浏览器无法正确识别为HTML文件。

用浏览器打开

保存文件后，按照以下步骤在浏览器中打开：

  1. 找到刚才保存的 index.html 文件
  2. 双击文件，或者右键选择 打开方式 → 选择浏览器
  3. 你就可以在浏览器中看到网页效果了
提示

如果双击没有反应，可以先打开浏览器（如Chrome、Edge等），然后将文件拖拽到浏览器窗口中。

修改和预览

如果你想修改网页内容：

  1. 在记事本中修改代码
  2. 保存文件（Ctrl + S）
  3. 切换到浏览器窗口，按 F5 刷新页面
技巧

建议同时打开记事本和浏览器窗口，这样修改代码后可以快速切换到浏览器按F5刷新查看效果。

💻 在线代码编辑器
👁️ 预览效果