文章摘要： HTML是描述语言，网页标准三大组成部分之一的HTML，负责网页的基本结构（页面元素和内容）。

  • 超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。

相关信息

外部相关文章

内部相关文章

注释

  • 避免使用样式相关的标签，建议使用style属性实现对样式的修改，即通过style属性写在操作对象的开始标签中。
  • HTML标签中的属性可以自定义，（重大发现）

简介

简要说明

  • HTML 是用来描述网页的一种语言。
  • HTML 指的是超文本标记语言: HyperText Markup Language
  • 标记语言是一套标记标签 (markup tag)。
  • HTML 使用标记标签来描述网页。
  • HTML 文档包含了HTML 标签及文本内容。
  • HTML文档也叫做 web 页面。
  • HTML用于定义整个页面的框架。

HTML编写格式

<!-- 声明文档类型是HTML文件 -->
<!DOCTYPE html>

<!-- HTML最外层 主要存放`<head>`和`<body>` -->
<html lang="en">

<!-- 头部 -->
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>网页标题名</title>
</head>

<!-- 内容 -->
<body>
  <h1>标题</h1>
  <p>段落</p>
</body>

</html>
  • <!DOCTYPE html>：称为DTD（文档类型定义），描述当前的文件是一个HTML格式的文件。
  • <meta charset="UTF-8">：描述页面的字符编码方式，不指定编码格式会导致中文乱码。

主要功能

  • 内容结构化：通过标签（tags）定义文档的结构，如标题、段落、列表等。
  • 链接创建：使用<a>标签创建指向其他网页或文件的超链接。
  • 媒体嵌入：允许嵌入图片（<img>）、视频（<video>）和音频（<audio>）等多媒体内容。
  • 表单处理：通过<form>和相关输入标签（<input>）实现用户输入和数据提交。
  • 样式应用：与CSS（Cascading Style Sheets）结合使用，定义网页的视觉效果和布局。

注意事项

  • 语义化标签：使用正确的HTML标签来提高可访问性和搜索引擎优化（SEO）。
  • 兼容性：不同浏览器可能对HTML的支持程度不同，编写代码时需考虑兼容性问题。
  • 可维护性：保持代码的清晰和结构化，便于后续维护和更新。
  • 安全性：避免在HTML中直接嵌入敏感信息，防止跨站脚本攻击（XSS）。
  • 性能优化：优化HTML代码，减少不必要的标签和嵌套，提高页面加载速度。

适用场景

  • 网页开发：构建和设计静态或动态网页的基础。
  • 网站布局：定义网站的整体布局和结构。
  • Web应用界面：为Web应用程序创建用户界面。
  • 电子邮件模板：编写用于发送新闻稿、营销邮件等的电子邮件模板。
  • 内容管理系统：在内容管理系统中，HTML用于定义页面模板和内容显示格式。
  • 移动开发：在移动应用中嵌入Web视图时，HTML用于显示Web内容。

注释

  • 程序员在代码中加入的辅助说明，不能被计算机执行，不受语法的限制，可以写任何内容。
  • 格式：内容写在<!--和-->之间。

HTML标签

详细总结：HTML标签

  • HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
  • HTML 标签是由尖括号包围的关键词，比如 <html>。
  • 标签是用于定义HTML元素和元素的属性的。

单标签

  • 单标签是由一个标签单独构成的，不需要开始和结束标签之间的内容。
  • 通常用于插入或引用元数据，或者执行某些无需包裹内容的操作。

双标签

  • 双标签由开始标签和结束标签组成，比如 <b> 和 </b>。
  • 标签对中的第一个标签是开始标签，第二个标签是结束标签。
  • 开始和结束标签也被称为开放标签和闭合标签。

块级元素

  • 块级元素在其前后都会开始新的一行（独占一行）。
  • 它们会尽可能地占据其父元素的整个宽度（除非设置了特定的宽度）。
  • 常见的块级元素包括：<div>、<p>、<h1>-<h6>、<ol>、<ul>、<li>、<form>、<table>等。

行级元素

  • 行级元素不会在其前后开始新的一行（不会独占一行）。
  • 它们只会占据内容所需的空间（不能手动设置宽高）。
  • 常见的行级元素包括：<span>、<a>、<button>、<label>、<strong>、<em>等。

行内块级元素

  • 不会独占一行。
  • 宽度和高度可以手动设置。
  • 常见行内块级元素包括：<input>、<button>、<img>等。

元信息（数据）标签

  • <meta>标签提供了当前HTML文档的元数据。
  • 用于被浏览器解析，这类似标记该文件的配置信息。
  • 元数据效果不会显示在浏览器页面。

HTML属性

  • 定义元素的行为、外观、与其他元素的关系。
  • 属性写在HTML元素的“开始标签”中。
  • 每个HTML元素可以同时具有多个不同的属性。
  • 属性名不区分大小写。
  • 属性值对大小写敏感。
  • 属性的值需要用引号" "括起来。
  • 多个属性之间用空格``隔开。
  • 单个属性中有多个值时用分号;隔开。

基本语法

<!-- 单标签 -->
<标签 [属性名="属性值" ...] />

<!-- 双标签 -->
<标签 [属性名="属性值" ...]>  </标签>

HTML特殊字符

有些特殊字符在html文件中不能直接显示。

  • &nbsq;空格
  • &lt;小于号
  • &gt;大于号
  • amp;按位与
更新时间: