HTMl 简介

HTML 是用于创建网页的标准标记语言。

HTML 是用于创建网页的标准标记语言。

! 本教程遵循最新的 HTML5 标准。

什么是 HTML？

  • HTML 代表超文本标记语言
  • HTML 是用于创建网页的标准标记语言
  • HTML 描述了网页的结构
  • HTML 由一系列元素组成
  • HTML 元素告诉浏览器如何显示内容
  • HTML 元素标记内容片段，例如“这是一个标题”、“这是一个段落”、“这是一个链接”等。

一个简单的 HTML 文档

下面是一个典型的 HTML 文档，从中可以看出 HTML 文档的基本结构

<!DOCTYPE html>
<html>
  <head>
    <title>GoBeta.NET - 让你的技术上线</title>
  </head>
  <body>
    <h1>GoBeta.NET</h1>

    <p>
      GoBeta.NET 是一个技术学习网站，提供有关软件开发、技术运维、项目管理等技术相关的教程、电子书和文章，提供更优的学习体验。
    </p>
  </body>
</html>

示例说明

  • <!DOCTYPE html> 声明定义，这个文件是一个 HTML5 文档
  • <html> 元素是一个 HTML 页面的根元素
  • <head> 元素包含有关 HTML 页面的元信息
  • <title> 元素指定 HTML 页面的标题（显示在浏览器的标题栏或页面的选项卡中）
  • <body> 元素定义了文档的身体，并且对于所有的可见内容，诸如标题，段落，图像，超链接，表格，列表等的容器
  • <h1> 元素定义了一个一级标题
  • <p> 元素定义了一个段落

什么是 HTML 元素？

一个 HTML 元素由一个开始标签、一些内容和一个结束标签定义：

<标签>内容在这里... </标签>

其中 <标签> 为开始标签，</标签> 是结束标签， 内容在开始标签和结束标签中间。

HTML 元素是从开始标签到结束标签的所有内容：

<h1>GoBeta.NET</h1>

<p>
  GoBeta.NET 是一个技术学习网站。<br>
  欢迎您！
</p>
开始标签 元素内容 结束标签
<h1> GoBeta.NET </h1>
<p> GoBeta.NET 是一个技术学习网站。 </p>
<br>

!! 一些 HTML 元素没有内容（如 <br> 元素）。这些元素称为空元素。空元素不需要结束标签。后面的还会遇到一些这样的元素，比如 <hr>。

网页浏览器

Web 浏览器（Chrome、Edge、Firefox、Safari）的目的是读取 HTML 文档并正确显示它们。

浏览器不显示 HTML 标签，而是使用它们来确定如何显示文档：

在浏览器中查看

上图是在 Mac 版的 Firefox 浏览器中的显示效果。

HTML 页面结构

下面是一个 HTML 页面结构：

<html>
<head>
<title>页面标题</title>
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落。</p>
<p>这是另一段。</p>

</body>

</html>

!! 注意： <body> 部分（上面的白色区域）内的内容将显示在浏览器中。<title> 元素内的内容将显示在浏览器的标题栏或页面的选项卡中。

HTML 历史

从万维网的早期开始，出现了许多版本的 HTML：

Year Version
1989 Tim Berners-Lee 发明了 www
1991 Tim Berners-Lee 发明了 HTML
1993 Dave Raggett 起草了 HTML+
1995 HTML 工作组定义的 HTML 2.0
1997 W3C 推荐标准: HTML 3.2
1999 W3C 推荐标准: HTML 4.01
2000 W3C 推荐标准: XHTML 1.0
2008 WHATWG 第一次 HTML5 公开草案
2012 WHATWG HTML5 标准
2014 W3C 推荐标准: HTML5
2016 W3C 推荐标准 候选版本: HTML 5.1
2017 W3C 推荐标准: HTML5.1 第二版
2017 W3C 推荐标准: HTML5.2
HTML编辑器