问小白 wenxiaobai
资讯
历史
科技
环境与自然
成长
游戏
财经
文学与艺术
美食
健康
家居
文化
情感
汽车
三农
军事
旅行
运动
教育
生活
星座命理

我的第一个网页 | 编程狮（w3cschool.cn）

创作时间:
作者:
@小白创作中心

我的第一个网页 | 编程狮（w3cschool.cn）

引用
1
来源
1.
https://www.w3cschool.cn/article/32906041.html

本文将以Windows系统为例，教你用最简单的记事本创建并保存第一个HTML网页。

第一步：准备工具

  • 文本编辑器：使用系统自带的记事本（无需下载）。

  • 按下 Win + S，输入“记事本”并打开。

  • 浏览器：Chrome、Edge等均可。

第二步：创建HTML文件

  • 新建文本文档
  • 右键桌面或文件夹 → 选择“新建” → “文本文档”。

  • 重命名为 .html 文件
  • 右键新建的文档 → 选择“重命名”。
  • 将文件名改为 index.html（关键步骤！）
  • ❗若看不到 .txt 扩展名：打开文件夹顶部菜单【查看】→ 勾选【文件扩展名】。

第三步：编写HTML代码

  • 右键 index.html → 选择“打开方式” → “记事本”。

  • 输入以下代码（复制粘贴即可）：
<!DOCTYPE html>
<html>
<head>
   <title>我的第一个网页 | 编程狮（w3cschool.cn）</title>
</head>
<body>
   <h1>欢迎来到编程狮！</h1>
   <p>我正在编程狮学习HTML！🐱💻</p>
</body>
</html>

第四步：保存文件

  • 按下 Ctrl + S 保存。
  • 确保保存类型正确：
  • 点击“保存类型”下拉框 → 选择【所有文件 (.)】
  • 确认文件名结尾为 .html（如 index.html）

第五步：在浏览器中查看

  • 双击 index.html 文件，浏览器会自动打开。
  • 效果应显示大标题和段落文字，如下图：

修改并更新网页

  • 右键文件 → 用记事本重新打开。
  • 修改文字（如将“编程狮”改为“W3Cschool”）→ 保存。
  • 返回浏览器 → 按下 F5 刷新页面，立即查看变化！

常见问题解答

  • 文件打开方式错误？

  • 右键.html文件 → “属性” → 将打开方式设置为浏览器。

  • 代码没效果？

  • 检查标签是否闭合（如 </h1>）。

  • 确保文件扩展名是 .html 而非 .txt。

  • 中文显示乱码？

  • 保存时选择编码为UTF-8：文件 → 另存为 → 底部编码选择UTF-8。

进阶推荐

  • 下一步学习建议：学会基础操作后，可尝试添加图片、链接等元素，逐步构建完整网页！
  • 课程推荐：《HTML入门课程》、《HTML + CSS 基础实战》
热门推荐
© 2023 北京元石科技有限公司 ◎ 京公网安备 11010802042949号