---
title: "IT课程 HTML基础 009_Hello HTML"
date: 2024-01-07T22:00:00.000Z
tags: ["IT课程", "HTML课程", "CSS课程", "JavaScript课程", "Java课程", "计算机系统与网络", "hello world", "hello html"]
categories: ["学习", "HTML基础"]
canonical: https://www.zhaojian.net/it-course-html-009/
author: 赵健
---
### 什么是 HTML ？
网络，或更具体的说，万维网（World Wide Web）是由很多链接在一起的文档和资源构成的。这些文档和资源是用HTML编写的，它们被称为网页。HTML是网页的基础，定义了网页的结构和内容。
当你在浏览器中输入一个网址（例如，`www.zhaojian.net`）时，浏览器会发送一个请求到提供该网页的服务器。服务器会响应这个请求，并将请求的网页（也就是一些HTML）发送回浏览器。然后，浏览器会解析这些HTML，并将它们显示为你通常看到的网页。
**HTML**（HyperText Markup Language，超文本标记语言）是一种用于创建和设计网页结构的标记语言。HTML 由一系列的**元素**（element）组成，这些元素可以用来包围不同部分的内容，使其以某种方式呈现或者工作。一对标签（tag）可以为一段文字或者一张图片添加超链接，将文字设置为斜体、粗体、段落、列表等。
> [!小结]
> - HTML 不是一种编程语言，而是一种**标记**语言
> - HTML 文档包含了HTML **标签**及**文本**（为什么没有图片）内容
> - HTML文档也叫做 **web 页面**、**网页**
***
### 一个完整的HTML元素（element）
示例：
```html
hello HTML!
```
效果：
#### 结构解析：
> [!小结]
> - 一个完整的HTML元素，由开始标签、内容、结束标签三部分组成；
> - **开始标签**（Opening tag）：包含元素的名称（本例为 p），被左、右角括号所包围。开头标签标志着元素开始或开始生效的地方；
> - **内容**（Content）：元素的内容；
> - **结束标签**（Closing tag）：与开始标签相似，只是其在元素名之前包含了一个斜杠。这标志着该元素的结束。没有包含关闭标签是一个常见的初学者错误，它可能会产生奇特的结果。
***
### 一个完整的HTML页面
示例：
```html
hello HTML
hello HTML!
```
效果：
#### 结构解析：
> [!小结]
> - `` — 声明HTML文档类型，文档类型是一个历史遗留问题，用于告诉浏览器该文档的版本和类型。
> HTML4 严格模式 DOCTYPE 声明：
> ``
> - `` — `html` 元素，HTML页面中的所有内容，有时被称为根元素。
> - `` — `head` 元素，它的内容对用户不可见，其中包含例如面向搜索引擎的搜索关键字（keyword）、页面描述、CSS 样式、JavaScript文件和字符编码声明等。
> - `` — `meta` 元素，用于提供有关 HTML 文档的元数据。charset 属性将你的文档的字符集设置为 UTF-8。
> - `` — `title` 元素。该元素设置页面的标题，显示在浏览器标签页上，也作为收藏网页的描述文字。
> - `` — `body` 元素。该元素包含期望让用户在访问页面时看到的内容，包括文本、图像、视频、游戏、可播放的音轨或其他内容。
> - ``— 段落元素，表示文本的一个段落。
|元素名称
|作用|示例|
|---|---|---|
|``|定义 HTML 文档的类型和版本|``|
|``|定义 HTML 文档的根元素|``|
|``|包含文档的元信息，如标题、字符集声明、样式和脚本链接等|`...`|
|``|定义文档的标题，显示在浏览器的标题栏或页签上|`<title>My Web Page`|
|``|提供有关文档的元信息，如字符集、视口设置、关键词等|` `|
|``|引用外部资源，如样式表和图标|` `|
|``|
|``|
|`