html入门核心概念与实用指南

【html入门】你的第一个网页之旅

对于想要踏入网页制作大门的新手来说，HTML（超文本标记语言）是第一块需要学习的基石。它不是一门编程语言，而是用于创建网页结构的标记语言。想象一下，如果一个网页是一栋房子，那么HTML就是房子的框架、墙壁、地板，决定了房子的基本布局和构成元素。理解HTML，就是理解构成网页的最基本单元。

什么是HTML？它有什么用？

HTML，全称HyperText Markup Language，顾名思义，它是一种“超文本”的“标记”语言。

“超文本”指的是可以包含指向其他文本或资源的链接的文本。这正是万维网能够互联互通的基础。

“标记语言”则是指它使用一系列预定义的“标记”（也就是我们常说的“标签”）来描述文档的结构和内容。这些标签告诉浏览器如何显示网页上的文本、图片、视频、链接等各种元素。

HTML最核心的用途就是构建网页的骨架。它负责定义网页的内容，比如哪里是一个标题，哪里是一个段落，哪里应该插入一张图片，哪里是一个可以点击的链接等等。离开了HTML，网页就无法呈现任何结构化的内容。

在哪里编写HTML代码？需要什么工具？

编写HTML代码非常简单，你不需要任何昂贵的专业软件。

你需要一个文本编辑器。任何能够编辑纯文本文件的软件都可以。

• 基础文本编辑器： Windows系统自带的记事本（Notepad）、macOS系统自带的TextEdit都可以用来写HTML。
• 专业的代码编辑器： 为了更高效地编写代码，建议使用一些专为开发者设计的代码编辑器，它们通常提供代码高亮（让不同类型的代码显示不同颜色）、代码补全、错误提示等功能。比如VS Code、Sublime Text、Atom、Notepad++等。选择一个你喜欢的即可，它们大多是免费的。

除了编辑器，你还需要一个网页浏览器。任何现代浏览器都可以用来打开和显示你编写的HTML文件。比如Chrome、Firefox、Safari、Edge等。浏览器会读取你的HTML代码，并将其解析、渲染成你在屏幕上看到的网页。

所以，开始学习HTML的成本是：零。你只需要一台电脑，上面有预装的文本编辑器和浏览器即可。

如何保存和预览HTML文件？

写好HTML代码后，需要将其保存成一个文件，然后在浏览器中打开。

1. 保存文件： 在文本编辑器中，选择“文件” -> “保存”或“另存为”。
2. 选择文件名和位置： 给你文件起一个有意义的名字，比如 index.html 或 mypage.html。关键在于文件的扩展名必须是 .html 或 .htm。 这个扩展名告诉操作系统这是一个HTML文件。将文件保存在你容易找到的地方，比如桌面或一个专门的学习文件夹。
3. 指定编码（可选但推荐）： 在保存时，如果编辑器提供选项，请选择使用 UTF-8 编码。这是网页内容最常用的编码方式，可以避免中文乱码问题。
4. 预览文件： 打开你的文件管理器（Windows资源管理器或macOS Finder），找到你刚刚保存的 .html 文件。双击它，它就会自动在你的默认网页浏览器中打开，显示出你编写的网页效果。你也可以右键点击文件，选择“打开方式”，然后选择你想使用的特定浏览器。

一个基本的HTML页面长什么样？

每一个HTML文件都遵循一个基本的结构框架。理解这个框架是入门的关键。

HTML页面的核心结构：

一个最简单的HTML页面至少包含以下几个部分：

• ： 这不是一个HTML标签，而是一个文档类型声明。它告诉浏览器这个文档使用的是HTML5标准。这是当前推荐的标准，几乎所有的现代网页都应该以它开头。
• ： 这是整个HTML文档的根元素，所有的其他内容都包含在这个标签内部。它通常有一个lang属性，例如 ，指示文档的主要语言。
• ： 这是文档的头部，包含了页面的元信息（metadata），这些信息不会直接显示在浏览器窗口中，但对浏览器、搜索引擎等很重要。头部常常包含：
  • ： 指定文档的字符编码，确保文本正确显示。UTF-8是国际通用的字符编码。