[前端系列第1弹]HTML入门教程:从零开始学习Web页面的基础知识

        HTML是一种用于描述Web页面内容和结构的标记语言,它由一系列的标签(tag)组成,每个标签都有特定的含义和功能。HTML标签可以嵌套使用,形成一个树状的文档对象模型(Document Object Model, DOM)。HTML标签可以包含文本、图片、链接、表格、列表等元素,也可以引入CSS和JS文件。一个简单的HTML文档如下:

<!DOCTYPE html>
<html>
<head>
  <title>My First Web Page</title>
</head>
<body>
  <h1>Hello, World!</h1>
  <p>This is a paragraph.</p>
</body>
</html>

        HTML文档的基本结构由以下几个部分组成:

  • <!DOCTYPE html> 声明文档类型为HTML5,告诉浏览器如何解析文档。
  • <html> 标签定义了整个文档的根元素,它包含了两个子元素:<head> 和 <body>
  • <head> 标签定义了文档的头部信息,它可以包含文档的标题、元数据(metadata)、样式表、脚本等。
  • <title> 标签定义了文档的标题,它会显示在浏览器的标签页上。
  • <body> 标签定义了文档的主体内容,它可以包含各种可见的元素,如标题、段落、图片、链接等。
  • <h1> 标签定义了一级标题,它通常用于表示文档的主题或最重要的内容。
  • <p> 标签定义了段落,它通常用于表示一段连续的文本。

        HTML标签有很多种类,它们可以分为以下几类:

  • 容器标签(container tag):这类标签需要有开始标签和结束标签,如<p></p>。它们可以包含其他的标签或文本作为内容。
  • 空标签(empty tag):这类标签只有一个单独的标签,如<br>。它们不需要结束标签,也不包含任何内容。它们通常用于表示一些特殊的功能或效果,如换行、水平线、输入框等。
  • 属性(attribute):这是一种附加在标签上的信息,用于提供更多的细节或控制标签的行为。属性由名称和值组成,如<img src="image.jpg" alt="An image">中的src和alt就是属性。属性值需要用引号括起来,可以是单引号或双引号。

        HTML还有一些特殊的字符,如&lt;表示小于号(<),&gt;表示大于号(>),&amp;表示和号(&),&quot;表示双引号("),&apos;表示单引号(')。这些字符需要用特殊的符号来表示,以避免和HTML标签混淆。