HTML（HyperText Markup Language）是一种标记语言，用于创建和结构化网页及其内容。它是构建网页的基础标准语言。
常见标签
文档的结构标签：
<html>：定义整个 HTML 文档。<head>：包含文档的元数据（例如标题、字符集、链接到样式表）。<title>：定义文档的标题，在浏览器的标签栏中显示。<body>：包含网页的内容部分，如文本、图像、链接等。<!-- 注释 --> <!-- DOCTYPE 表名本文档属于html5标准 每个html标准都会收纳对应的标签 --> <!DOCTYPE html> <!-- html为网页的根标签 嵌套包含所有标签 一般情况：标签分为开始标签和结束标签，开始标签可以带有标签页的属性，结束标签一般带有/ --> <html lang="en"> <!-- 头标签 --> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 主题 就是网页的名字 --> <title>hello world</title> </head> <!-- 身体标签 --> <body> </body> </html>文本格式化标签
<h1>到<h6>：定义标题，<h1>为最大标题，<h6>为最小标题。<p>：定义段落。<b>和<strong>：加粗文本，<strong>语义上更强。<i>和<em>：斜体文本，<em>语义上更强。- <sup> 和<sub>：上标和下标
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>尝试</title> </head> <body> <div> <h1>一级块一级标题<span>span隔离标签</span></h1> <p>段落</p> <div> <!-- <hr>水平分割线 --> <hr> <h1>二级块的一级标题</h1> <p>段落段落段落<br>段落段落</p> </div> <b>粗体b </b><strong> 粗体strong</strong><br> <i>斜体i </i><em> 斜体em</em><br> <u>下划线u</u><br> <del>删除线del</del><br> <sup>上标</sup>文本sup 文本sub<sub>下标</sub> co<sub>3</sub><sup>2-</sup> </div> </body> </html>列表
<ul>：无序列表。<ol>：有序列表。<li>：列表项。- <dd>：有缩进、<dt>：没有缩进。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <ul> <li>无序列表1</li> <li>无序列表2</li> <li>无序列表3</li> </ul> <ol> <li>有序列表1</li> <li>有序列表2</li> <li>有序列表3</li> </ol> <dl> <dt>与dd的等级是并列的但没有缩进</dt> <dd>有缩进的自定义列表1</dd> <dd>有缩进的自定义列表2</dd> <dd>有缩进的自定义列表3</dd> </dl> </body> </html>图片、声音、视频和超链接
<a>：定义超链接，用于创建指向其他网页或资源的链接。<img>：插入图像，需要src属性指定图像源 URL。- <audio>：插入声音。
- <video>：插入视频。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <span id="111">第一锚点</span> <div> <hr> <hr> <hr> <span id="222">第二锚点</span> <hr> <hr> <hr> </div> <div> <video src="./video/9.乌龟绘图.mp4" controls width="300">视频</video> </div> <div> <audio src="./audio/bg.mp3" controls width="300">声音</audio> </div> <div> <img src="./img/1.png" alt="" width="300"> </div> <div> <a href="http://www.baidu.com" title="百度" target="_blank">百度</a> <a href="./第一批标签.html" target="_blank">打开第一批标签</a> <a href="./第二批标签.html" target="_blank">打开第二批标签</a> <a href="#111">回到第一锚点</a> <a href="#222">回到第二锚点</a> </div> </body> </html>表格
<table>：定义表格。<tr>：定义表格行。<td>：定义表格单元格（数据）。<th>：定义表格标题单元格。<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <table> <tr> <th>表头1</th> <th>表头2</th> <th>表头3</th> </tr> <tr> <td>表1</td> <td>表2</td> <td>表3</td> </tr> </table> </body> </html>表单
<form>：定义表单，用于收集用户输入。<input>：定义输入字段。<textarea>：定义多行文本区域。<button>：定义按钮。- <option>：定义选项。
- <multiple>：多个选择。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <form method="post" action="http://httpbin.org/post"> <div> <label for="username">用户名 <input name="用户名" required placeholder="请输入" type="text" id="username"></label> </div> <div> <label for="password">密码 <input name="密码" required placeholder="请输入" type="password" id="password"></label> </div> <div> <span>性别</span> <label for="man">男 <input name="sex" value="man" type="radio" id="man"></label> <label for="wemon">女 <input name="sex" value="wemon" checked type="radio" id="wemon"></label> </div> <div> <span>年龄</span> <input type="range" min="0" max="100" step="1" name="age" value="range" ></label> </div> <div> <span>兴趣</span> <label for="backetball">篮球 <input name="new" value="backetball" type="checkbox" id="backetball" ></label> <label for="fultball">足球 <input name="new" value="fultball" type="checkbox" id="fultball" ></label> <label for="ganlan">橄榄球 <input name="new" value="ganlan" type="checkbox" id="ganlan"></label> </div> <div> <span>颜色</span> <input type="color" name="color" value="color" > </div> <div> <span>附件</span> <input type="file"> </div> <div> <span>户籍地</span> <select name="shengfen" id="1"> <option value="henan">河南</option> <option value="shanxi1">陕西</option> <option value="shanxi2">山西</option> </select> </div> <div> <span>多选</span> <select name="duoxuan" id="" multiple size="4"> <option value="henan1">河南</option> <option value="shanxi1">陕西</option> <option value="shanxi2">山西</option> </select> </div> <div> <span>输入</span> <textarea name="text" id="" cols="50" rows="1" placeholder="请输入"></textarea> </div> <div> <input type="submit" value="注册"> <input type="reset" value="清空"> </div> </form> </body> </html>常见属性
id：唯一标识符，用于在 CSS 或 JavaScript 中引用元素。例如：<div id="header">.class：指定元素的类名，用于样式化和 JavaScript 操作。例如：<p class="text-primary">.style：内联样式，直接在元素上应用 CSS。例如：<p style="color: red;">.href：定义链接的目标 URL，用于<a>标签。例如：<a href="https://example.com">.src：指定图像或媒体资源的 URL，用于<img>和<video>标签。例如：<img src="image.jpg">.alt：提供图像的替代文本，用于<img>标签。例如：<img src="logo.png" alt="Company Logo">.title：提供额外的信息，当用户悬停在元素上时显示。例如：<button title="Click me">.type：定义输入字段的类型，用于<input>标签。例如：<input type="text">.value：指定表单元素的默认值，例如<input value="default">.name：为表单元素定义名称，用于提交数据时的标识。例如：<input name="username">.
这些属性可以更好的控制HTML元素的显示和行为。
