HTML - 超文本标记语言

2025年03月17日 | 阅读 9 分钟
HTML - Hypertext Markup Language

如今,每个人都清楚网站的用处以及它在人们生活中的影响。您甚至可以通过网站访问这些内容。无论是社交网络、音乐服务提供商网站还是教育内容网站,每个网站都是使用超文本标记语言 (HTML) 创建的。通过仔细观察网站构建过程,我们可以发现 HTML 的重要性。它基于在编辑器中编写的 HTML 代码,并为页面组件提供必要的结构。组件包括标题、页脚、主内容和内联元素。因此,HTML 是一个有用的工具,可以借助 HTML 元素方便地创建网页。

什么是 HTML?

HTML 是 Hypertext Markup Language(超文本标记语言)的缩写。这种标准标记语言用于创建网页。HTML 包含指导浏览器如何显示内容的元素,一个简单的 HTML 文档包含标签。

HTML 是用于设计网站内容的标准语言。层叠样式表 (CSS)JavaScript (JS) 是帮助 HTML 在设计网站时发挥更好作用的技术。因此,这些技术可以与 HTML 一起使用。

HTML 负责将本地存储位置和 Web 服务器上的 HTML 文档渲染到多媒体页面。HTML 包含实际文档的提示。此外,它还描述了网页的结构。

HTML - Hypertext Markup Language

HTML 的历史和发展

  • HTML 中的元素充当 HTML 页面的构建块。交互式表单,包括结构、图像和其他对象,也可以添加到渲染后的页面中。可以通过 HTML 创建结构化文档,并且可以通过标题、列表、段落、引用、链接和其他项目等结构语义来实现。角度括号用于构成 HTML 元素的标签。有些标签可以直接将内容输入页面,例如 <img/> 和 <input/> 标签。然而,许多标签,如 <p>,会围绕内容并提供文档信息。此类标签可能包含子元素。浏览器的任务不是显示标签,而是解释页面的内容并将其显示给用户。
  • JavaScript 等其他脚本语言编写的程序可以嵌入到 HTML 中。通过包含 CSS,还可以更改内容的外观和布局。**万维网联盟 (W3C)** 鼓励使用 CSS,该联盟目前维护 CSS 标准,并以前负责 HTML 标准。
  • Tim Berners-Lee 曾是 CERN 的一名物理学家和合同工。他提出了一种信息使用和共享的系统;该原型被称为 ENQUIRE。Berners 随后于 **1989 年**提出了一种基于互联网的系统,这是一个超文本系统。 **1990 年**,Berners-Lee 编写了浏览器和服务器软件,并规定了 HTML。Berners Lee 和 Robert Cailliau 合作争取资金;然而,CERN 没有正式采纳他们的项目。**Robert Cailliau** 是 CERN 的一名数据系统工程师。他还列出了超文本可以使用的领域,并且首先是百科全书。这是他笔记中列出的清单。
  • "HTML 标签" 是第一个公开的 HTML 文档描述,由 Tim Berners-Lee 于 **1991 年**首次提及。最初的简单 HTML 设计包含约 18 个元素。
  • 其中一些元素仍然存在于 HTML 4 中,大约有 11 个。这些受到了基于 SGML(标准通用标记语言)的文档的影响。SGML 是 CERN 的内部文档格式。
  • HTML 用于将文本、图像等组合到网页中;它用作标记语言来解释内容。

HTML 中的标签

HTML 中有许多标签,它们有助于向服务器描述网页的过程。这些标签以特定方式排列以获得所需的输出。下面将讨论一些重要的 HTML 标签 -

  1. <!Doctype> - 它描述文档类型
  2. <html> - 描述文档是 html 文档
  3. <title> - 描述文档标题
  4. <body> - 描述文档正文
  5. <h1> 到 <h6> - 描述 html 中的标题
  6. <p> - 描述一个段落
  7. <br> - 产生单行换行
  8. <hr> - 描述主题内容的更改
  9. <!--?--> - 描述注释

HTML 中的标签是有用的实体,允许开发人员操纵网页的外观和功能。此外,一些标签有闭合标签,包括斜杠,表示闭合标签。闭合标签的例子有 body、title 和 html。但是,一些标签没有闭合标签;这些标签的例子是 <br> 和 <img>。这些元素通常被称为 HTML 中的空元素或 void 元素。

HTML 中的其他有用标签是 -

  1. <b> - 用于加粗书写的文本。
  2. <i> - 用于将书写的文本设置为斜体。
  3. <u> - 用于为标签中书写的内容添加下划线。
  4. <li> - 用于在内容中创建列表。
  5. <ol> - 用于在内容中创建有序列表。
  6. <ul> - 用于在内容中创建无序列表。
  7. <marquee> - 为内容中的文本或图像添加滚动效果。

HTML 中的元素

HTML 元素由起始标签和结束标签包围,并包含其他内容。结束标签使用斜杠关闭。但是,有些元素不需要结束标签,这些元素被称为 void 元素。

HTML 标签和 HTML 元素之间的区别

HTML 标签HTML 元素
HTML 中的标签包含 HTML 元素。HTML 中的元素包含内容。
HTML 中的标签以“<”开头,以“>”结尾。HTML 元素被描述为写在标签内的任何内容。
HTML 中的标签类似于关键字,每个标签都有特定的含义。通用内容由 HTML 元素指定。

HTML 的用途

HTML 是一种标记语言,用于创建网页和 Web 应用程序。它在与 JavaScript 和 CSS 结合使用时,在 Web 开发中得到了广泛的应用。

HTML 的一些最重要的应用列于下

  1. Web 开发
    创建网页是 HTML 最常用的应用之一。所有页面都包含一些标签,这些标签定义了页面,超链接用于连接页面。每个页面都是用 HTML 代码编写的。
  2. Web 文档创建
    HTML 的另一个用途是文档创建。文档创建是使用基本标签和文档对象模型 (DOM) 完成的。Web 文档有三个部分:标题 (title)、头部 (head) 和正文 (body)。在头部包含标识文档的信息,例如标题和重要关键字。标题在浏览器中可见,而正文部分包含消费者看到的主要内容。这些部分是使用 HTML 标签创建的,并且是为特定目的使用特定标签完成的。因此,标题、头部和正文被包含在一个循环中。
  3. 互联网导航
    通过超文本功能可以进行互联网导航。这是 HTML 最广泛使用的功能之一。它是将用户引向另一个网页的文本,方便用户导航。即使这些页面位于不同的服务器上,它也能轻松地在网页之间导航。
  4. 尖端功能
    HTML5 是网站开发领域的游戏规则改变者。HTML5 具有最新的标准和 API 集,可以使用 Google Chrome 完美实现。
  5. 网页上的响应式图片
    可以使用查询来设置响应式图片。开发人员可以完全控制用户如何渲染图像,并且可以通过结合 picture 元素使用 img 元素的 srcset 属性来完成。因此,可以上传尺寸变化的图像。
  6. 在游戏开发中的应用
    HTML5、CSS3 和快速的 JavaScript 引擎的出现为用户提供了丰富的体验。对于游戏开发,大多数 API 功能都可以利用,而其他功能可以被排除。
  7. HTML 提供数据录入支持
    使用 HTML5 可以轻松进行数据录入工作。使用 HTML5 标准和 API,可以添加文本、数据等字段。它对数据录入很有用,并且最终用户将获得更好的数据录入体验。
    HTML - Hypertext Markup Language

使用 HTML 进行 Web 开发

标题、段落、图像、数据等是网页的组成部分。HTML 在 Web 开发中应用广泛,因为开发人员使用 HTML 进行前端开发。HTML 元素的作用是指定每个网页上的信息类型。例如,段落由“p”表示。编写 HTML 代码以关联页面上的不同项目。

HTML 在网页中的工作原理

HTML 对于您想要设计的任何网页都至关重要。HTML 代码用于设计网站的基本结构,并且可以使用 CSS 和 JavaScript 来操作元素。

例如,HTML 可用于指定网页上的标题。之后,可以使用适合组织品牌形象的适当大小、颜色和尺寸进行编辑。

HTML 用于向搜索引擎指示结构元素的函数,并使内容摘要更容易。

例如,Mark 将图像标题为“figcaption”元素,并将图像和标题包含在“figure”元素中。在这种情况下,搜索引擎很容易理解这两部分是相互关联的,并且标题是对存储图像的描述。

什么是 HTML5?

HTML5 是最新版本的 HTML,用于在网站上构建内容。它的设计目的是呈现 World Wide Web 上可以消费的所有内容。

HTML 和 HTML5 之间的区别

HTMLHTML5
它需要 flash 播放器支持才能支持音频和视频;否则,它不支持。它可以使用 <audio> 和 <video> 标签轻松支持音频和视频。
使用 Cookie 存储临时数据。使用 SQL 数据库和应用程序缓存存储临时数据。
不允许在浏览器中运行 JavaScript。HTML5 具有 JS Web Worker API,可以在后台运行 JavaScript。
VML、Silver-light、flash 等技术使得矢量图形成为可能。矢量图形是 HTML5 的组成部分。
不允许拖放效果。允许拖放效果。
HTML 中无法实现圆形、矩形、三角形等形状。HTML5 中允许圆形、矩形、三角形等形状。
旧浏览器支持 HTML。Mozilla、Chrome 等新浏览器支持 HTML5。
冗长复杂的 Doctype 声明。简单易懂的 Doctype 声明。
HTML 对移动设备不太友好。HTML5 对移动设备更友好。
缺少 nav、header 等元素。存在 nav、header 等新元素。
冗长复杂的字符编码。与 HTML 相比,字符编码更简单。
几乎不可能通过 Web 浏览器进行地理位置跟踪。借助 JS Geolocation API 可以进行地理位置跟踪。
HTML 无法处理不准确的语法。HTML5 可以处理不准确的语法。
HTML 中不存在 charset、ping 等一些属性。HTML5 包含 charset、ping 等属性。

HTML 的优点和缺点

优点

  • 它是一种广泛使用的语言。
  • 所有浏览器都支持它。
  • 它可以轻松学习和使用。
  • 轻量级,内容加载速度快。
  • 由于它默认内置在每个窗口中,因此无需额外软件即可运行。
  • 易于使用。
  • 宽松的语法。
  • 与其他语言相比,编写 HTML 更容易。
  • 新程序员可以轻松编写 HTML 代码并获得专业知识。
  • 使用模板可以进一步简化网页设计。
  • 有许多应用,因此对 Web 设计初学者很有用。
  • 支持所有网站。
  • 构建并运行在几乎所有网站上。
  • HTML 用于数据存储的使用已显著增加。
  • 由于 HTML 是免费的,因此无需购买任何软件。
  • 默认存在,因此为开发人员节省了金钱。
  • 代码编写简短方便,有许多标签和属性可以使任务更容易。

缺点

  • HTML 是一种静态语言,因此无法单独产生动态结果。
  • 很多时候 HTML 的结构变得难以理解。
  • 错误可能会让您付出金钱。
  • 创建表格、列表、表单和维护颜色方案需要时间。因此,这非常耗时。
  • HTML 对于动态页面没有用。
  • 创建简单的网页需要编写很长的代码。
  • 需要检查已弃用的标签,因为如果 HTML 与另一种语言一起使用,它可能会覆盖代码并更改标签。因此,还需要了解其他语言。
  • HTML 的安全功能有限。
  • 如果我们想用 HTML 编写长代码,就会产生复杂性。
  • HTML 只创建纯静态页面。
  • 即使是简单的网页也需要严格的代码编写。