HTML手册简介超文本标记语言（Hyper Text Markup Language）是一种用来结构化 Web 网页及

简介

超文本标记语言（Hyper Text Markup Language）是一种用来结构化 Web 网页及其内容的标记语言。

DOM由一系列元素（Element）组成，在代码中，一个典型的元素包括一个开始标签，一个结束标签，以及中间的文本内容。标签由成一对的尖括号（大于，小于号）包围，中间为元素名称，结束标签在元素名之前包含了一个斜杠。

My cat is very grumpy.

所有元素的标签都成对出现
如<img>元素为空元素，不包含内容，通过属性产生效果
必须保证嵌套层次正确，如</strong>前一个标签为<strong>
元素也可以有属性（Attribute），写在开始标签元素名称后，没写则为默认值。
图示中 class 为属性名，nice 为属性值。

资源

MDN参考手册： HTML（超文本标记语言） | MDN (mozilla.org)

Web固定标准(ECMA- 262)： www.ecma-international.org/publication…

文档格式

<!DOCTYPE>文档类型声明：位于文档的最前面，用于向浏览器说明当前文档使用哪种HTML或XHTML标准规范。
<html></html>根标记：标志着HTML文档的开始，</html>标记标志着HTML文档的结束，在它们之间是文档的头部和主体内容。
<head></head>头部标记：文档头部的标记，如<title>、<meta>、<link>及<style>等，用来描述文档的标题、作者以及和其他文档的关系等。
<body></body>主体标记：文件所要显示的内容。

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    Content
</body>
</html>

其他

块级:<div>换行
行内:<a>

注释:  包裹起来

标题、段落、文本:

 <h1>这是标题 1</h1> 
 <h2>这是标题 2</h2> 
 <h3>这是标题 3</h3> 
 <h4>这是标题 4</h4> 
 <h5>这是标题 5</h5> 
 <h6>这是标题 6</h6>
 
 <p>一段文字</p>

段落：换行，段落间有间隙

<br>：换行

<hr>：分割线

    <b>加粗</b> <strong>加粗</strong>
    <u>下划线</u> <ins>下划线</ins>
    <i>倾斜</i> <em>倾斜</em>
    <s>删除线</s> <del>删除线</del>

以上两种效果相同，语义化：利于SEO

多媒体

图片： <img src="./cat.gif" alt="这是一只猫" title="picture of a cat">

src：目标图片路径（相对）
alt：替换文本
title：悬停提示文字
width/height：宽高尺寸（默认等比）

音频：<audio src="./music.mp3" controls></audio>（可用MP3、Wav、Ogg)

视频：<video src="./mv.mp4"></video>

src：目标路径
controls：播放控件
autoplay (muted)：自动播放
loop：循环播放

锚链接：<a href="#" target="_blank">点击跳转</a>

href：调整地址（空为#）
target: _blank：新标签页 _self：当前标签页

HTML手册

简介

资源

文档格式

其他

标题、段落、文本:

多媒体

列表