html5
<p>说明：花了一天时间看着视频，基本过了一遍html5知识</p><p>参考链接：https://www.bilibili.com/video/av15241731?from=search&seid=6009616845277882348</p>
<h1 id="i2dHS" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px">基本知识</h1>
<h2 id="2YquP" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">定义</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">html:超文本标签语言,用文本表示特殊标签的语言，标签由<></>组成</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">例子：<标签名>内容</标签名> </p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"><strong>加粗字体</strong></p>
<h2 id="Rou5W" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px"> </h2>
<h2 id="LEtK9" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">基本格式</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"><!DOCTYPE html> 使用的是html5版本</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"><html> 根标签</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <head> 头标签</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <meta charset="UTF-8"> 字符编码方式</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <meta name="viewport" content="width=device-width, initial-scale=1.0"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <title></title> 标题标签</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </head>></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <body></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </body></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"></html></p>
<h2 id="6wCEt" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px"> </h2>
<h2 id="oNVTe" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">双标签与单标签</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">双标签（绝大多数）：<body>标签开始部分 </p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </body>标签结束部分</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> /关闭符号</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">单标签（一小部分）：<br />、<hr />、<input />、<img /></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </p>
<h2 id="XA6LV" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">关系</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">嵌套关系：</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"><html></html>是一切标签的父标签</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"><head></head>是<title></title>的父标签</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">如果两个标签之间是嵌套关系，子元素最好缩进一个tab身位</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">并列关系：</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"><head></head>和<body></body>是并列关系，同一级别</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">如果两个标签之间是并列关系，最好上下对齐</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </p>
<h2 id="8gZW3" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">快速创建</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">在vscode的html文件页面中输入！或者html：5，再按tab即可快速创建框架</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </p>
<h2 id="sdNqV" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">字符集</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> GB2312：简体中文，包括6763个汉字</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> BIG5：繁体中文，港澳台地区使用</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> GBk：简体+繁体中文，是GB2312的扩展</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> UTF-8：包含全世界所有国家字符，避免出现字符集不统一而出现的乱码情况</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </p>
<h2 id="dbZo0" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">标签语义化</h2>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">好处：</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 方便阅读和维护</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 让浏览器能够快速解析</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 便于搜索引擎优化</p>
<p style="text-indent: 2em; color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0">核心：合适的地方放置一个最为合理的标签</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </p>
<h1 id="oetLL" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px">标签</h1>
<h2 id="23F86" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">排版标签</h2>
<h3 id="VJJ3z" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">标题标签</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 作为标题使用，依据重要性递减<h1>~<h6></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <h1>标题1</h1></p>
<h3 id="i2B37" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">段落标签</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 将网页中的文字有条理的显示出来，进行分段</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 在浏览器中会根据浏览器布局大小自动换行</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <p>段落</p></p>
<h3 id="FG32e" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px"> 水平线标签</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 网页中使用水平线将段落与段落之间分割，使文档结构清晰</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <hr /> </p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 注意：单标签</p>
<h3 id="yYGUB" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">换行标签</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 可以使文本换行显示</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <br /></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 注意：单标签</p>
<h3 id="155Y6" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">div span标签（未完结）</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> div span 没有语义，是网页布局的两个盒子</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> div是division的缩写，是分割、分区的意思</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> span是跨度、跨距，范围的意思</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <div></div></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <span></span></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </p>
<h2 id="jGgTB" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px"> 文本格式化标签</h2>
<h3 id="43Zen" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">粗体</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <b></b>：只是进行加粗</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <strong>(推荐使用)</strong>：进行加粗的同时，强调</p>
<h3 id="kSdXA" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">斜体</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <i></i>:只进行倾斜</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <em></em>：进行倾斜的同时，强调</p>
<h3 id="WkQfG" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">加删除线</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <s></s>：只是进行加删除线</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <del></del>:进行加删除线的同时，强调</p>
<h3 id="LBr7D" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">加下划线</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <u></u>：只是进行加下划线</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <ins></ins>：进行加下划线的同时，强调</p>
<h2 id="vBDgE" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">标签属性</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <标签名 属性1="属性1" 属性2="属性2" ···>内容</标签名></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 标签可以拥有多个属性，必须写在开始标签中，位于标签名后面</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 属性之间不分先后顺序，标签名和属性、属性和属性之间均以空格分开</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 任何标签的属性都有默认值，省略该属性则取默认值</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 采取 键值对 的格式 key = value</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 例：<hr width="500" color="red"/></p>
<h2 id="prwLK" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px"> 图像标签</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 可以在网页中显示图像</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 注意：单标签</p>
<h3 id="GXp9E" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">基本插入方式</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="图像URL" /></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 图像的路径</p>
<h3 id="hUnt5" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">带有alt的图像</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="图像URL" alt="这是我的1"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 图像不能显示时的替换文本</p>
<h3 id="tEK56" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">带有title的图像</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="图像URL" title="这是我的2"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 鼠标悬停时显示的内容</p>
<h3 id="LCY7x" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">带有width和height的图像：</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="图像URL" title="这是我的3" width="400"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="图像URL" title="这是我的3" height="400"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 设置图像的宽度和高度</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 一般只需要宽度或高度即可，图片会自动等比例缩放</p>
<h3 id="ziTEn" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">带有border的图像</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="图像URL" title="这是我的3" width="400"/ border="10"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 设置图像框的宽度</p>
<h2 id="aJstZ" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">链接标签</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> anchor的缩写</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <a herf="跳转目标" target="目标窗口的弹出方式">文本或图像</a></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> herf：用于指定连接目标的url地址</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> target：用于指定链接页面的打开方式，取值有self和blank两种，其中self为默认值，blank为在新窗口中打开</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <a href="http://www.baidu.com">百度</a></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 外部链接需要添加：http://</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 内部链接直接链接内部页面名称即可：<a herf="index.html">首页</a></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 如果没有确定链接目标，<a herf="#">表示暂时为一个空链接</a></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 不仅仅可以创建文本超链接，网页中各种元素（图像、表格、音频、视频等都可以添加超链接</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 锚点定位：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 第一步：使用“a herf="#id名" 链接文本 /a”创建链接文本</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <a herf="#live">个人生活</a></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 第二步：使用相应的id名标注跳转目标的位置</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <h3 id="live">个人生活</h3></p>
<h3 id="Htk2J" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px"> base标签</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 设置整体链接的打开状态</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 在<head></head>中加入<base /></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 注意：单标签<base /></p>
<h3 id="6T5E7" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">特殊字符标签</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 空格 ：&nbsp;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 小于号<：&lt;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 大于号>：&gt;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 和号&：&amp;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 人命币￥：&yen;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 版权©：&copy;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 注册商标®：&reg;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 摄氏度℃：&deg;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 正负号±：&plusmn;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 乘号×：&times;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 除号÷：&divide;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 平方2（上标2）：&sup2;</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 平方3（上标3）：&sup3;</p>
<h3 id="Q9qYl" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px"> 注释标签</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <!--注释内容--></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 快捷键：ctrl+/</p>
<h1 id="RTXb6" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px">路径</h1>
<h2 id="rLqPT" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">相对路径</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 1.图像文件和html文件位于同一文件夹，只需输入图像文件的名称即可</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="logo.gif" /></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 2.图像文件位于html文件的下一级文件夹，输入文件夹名和文件名，之间用/隔开</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="img/img01/logo.gif" /></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 3.图像文件位于html文件的上一级文件夹，在文件名之前加入../ 如果是上两级，则需要使用../../ 依次类推</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <img src="../logo.gif" /></p>
<h2 id="hrtun" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px"> 绝对路径</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> D:web\img\logo.gif:不常用，只能在本机中使用</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 完整的网络地址：http://www.itcast.cn/images/logo.gif</p>
<h1 id="meF07" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px"> 列表标签</h1>
<h2 id="U03Fw" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">无序列表</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <ul></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <li></li></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <li></li></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <li></li></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </ul></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 注意：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <ul></ul>中最好只存在<li></li></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <li></li>之间相当于一个容器，可以容纳所有元素</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 比如在<li></li>中加入<p></p></p>
<h2 id="PedC9" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px"> 有序列表</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 按照一定顺序进行排序</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <ol></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <li></li></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <li></li></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <li></li></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </ol></p>
<h2 id="FFFw1" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">自定义列表</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 常用于对术语或名词进行解释和描述，定义列表的列表项前没有任何相互符号</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <dl></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <dt>名词1</dt></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <dd>名词1解释1</dd></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <dd>名词1解释2</dd></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> ···</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <dt>名词2</dt></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <dd>名词2解释1</dd></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <dd>名词2解释2</dd></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> ···</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </dl></p>
<h1 id="BMSGN" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px">表格</h1>
<h2 id="JIMVt" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">基本语法</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <table> 表格</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr> 行</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>单元格中的文字</td> 单元格</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> ···</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> ···</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </table></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 实例：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <table width="500" height="300" border="1"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>1</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>2</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>3</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>4</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>5</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>6</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>7</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>8</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>9</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </table></p>
<h2 id="vK5VA" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">表格属性</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> border：设置表格的边框（默认“border=0”无边框）</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> cellspacing：设置单元格与单元格边框之间的空白间距</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> cellpadding：设置单元格内容与单元格边框之间的空白间距</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> width：设置表格的宽度</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> height：设置表格的高度</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> align：设置表格在网页中的水平对齐方式（left、right、center，默认left）</p>
<h2 id="nNTIj" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">表头标签</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 表头一般位于表格第一行或第一列，文本加粗居中</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 用法：将表头标签<th></th>替换相应的单元格标签<td></td>即可</p>
<h2 id="afplz" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">表格结构</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <table width="500" height="300" border="1"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <thead></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>1</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>2</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>3</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </thead></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tbody></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>4</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>5</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>6</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>7</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>8</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>9</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tbody></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </table></p>
<h2 id="WmHQ1" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px"> 表格标题</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <table></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <caption></caption></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </table></p>
<h2 id="WFdPz" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">合并单元格</h2>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 合并时要将多余的行/列删除，删除的个数=合并的个数-1</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 合并顺序：先上后下，先左后右</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 跨行合并（rowspan）：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <table width="500" height="300" border="1"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <thead></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>1</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>2</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td rowspan="2">3</td> 2代表合并2个单元格</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </thead></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tbody></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>4</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>5</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <!--<td>6</td>-->将这个删除</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>7</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>8</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>9</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tbody></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </table></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 跨列合并（colspan）：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <table width="500" height="300" border="1"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <thead></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>1</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>2</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>3</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </thead></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tbody></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>4</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>5</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>6</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td>7</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <td colspan="2">8</td></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <!--<td>9</td>-->将这个删除</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tr></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </tbody></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </table></p>
<h2 id="ye1Jw" style="padding: 7px 0; margin: 0; font-size: 24px; line-height: 32px">表单标签</h2>
<h3 id="ymsad" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">input控件</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 注意：单标签</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> type：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> text：单行文本框输入</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="text"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> password：密码输入框</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="password"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> radio：单选按钮</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="radio"/>男 <input type="radio"/>女</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> checkbox：复选框</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="checkbox"/>足球 <input type="checkbox"/>篮球</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> button：普通按钮</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="button" value="搜索"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> submit：提交按钮</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="sumbit" /> 默认“提交”</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="sumbit" value="提交按钮"/> 也可更改</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> reset：重置按钮</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="reset" /></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> image：图像形式的提交按钮</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="image" src="1.jpg"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> file：文件域</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="file" /> 可以添加文件</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> name：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 由用户自定义：控件的名称</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 单选框，用name来实现一组的效果</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="radio" name="sex"/>男 <input type="radio"/ name="sex">女</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 复选框</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="checkbox" name="hobby"/>足球 <input type="checkbox" name="hobby"/>篮球</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> value：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 由用户自定义：input控件中的默认文本值</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="text" value="用户名"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> size：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 正整数：input控件在页面中的显示</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> checked：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> checked：定义选择控件默认被选中的项</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="radio" check="checked"/>男 默认选中</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> maxlength：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 正整数：控件允许输入的最多字符数</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="password" maxlength="6"/></p>
<h3 id="fRROh" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">label标签</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 用于绑定一个表单元素，当点击label标签时，被绑定的表单元素就会获得输入焦点</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 1.用label直接进行包裹input即可</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <label>输入账号：<input type="text"/></label></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 2.如果label中有多个表单，想定位到某个，可以用for id的格式进行</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <label for="two">输入账号：<input type="text"/> </label><input type="text" id="two"/></label></p>
<h3 id="FboDo" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px"> textarea控件（文本域）</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <textaera cols="每行的字数" row="显示的行数"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 文本内容</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </textaera></p>
<h3 id="CrjMx" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">下拉菜单</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <select></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <option>北京</option></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <option>上海</option></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <option selected="selected">广州</option> 可以将这个放在第一位</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </select></p>
<h3 id="Fy5bk" style="padding: 7px 0; margin: 0; font-size: 20px; line-height: 28px">表单域</h3>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> action：在表单收到信息后，需要将信息传递给服务器进行处理，action属性用于指定接收并处理表单数据的服务器程序的url地址</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> method：用于设置表单数据的提交方式，取值为get或者post</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> name：用于指定表单的名称，来区分同一个页面的多个表单</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 注意：每个表单都应该有自己的表单域</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <form action="url地址" method="提交方式" name="表单名称"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 各种表单控件</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </form></p>
<h1 id="m08Ef" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px">常用新标签</h1>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 可在w3c手册中文官网：http://w3school.com.cn/查看</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> header：定义文档的页眉</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> nav：定义导航栏链接部分</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> footer：定义文档或节的页脚</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> article：定义文章</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> section：定义文档中的节</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> aside：定义其所处内容之外的内容，侧边</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> datalist：标签定义选项列表，与input元素搭配使用</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="test" value="输入" list="1"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <datalist id="1"></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <option>11</option></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <option>12</option></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </datalist></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> filedset：元素可将表单内的相关元素分组，打包，与legend搭配使用</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <filedset></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <legend>用户登录</legend></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 用户名：<input type="test"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </filedset></p>
<h1 id="UHEzf" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px">新增input type属性值</h1>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> email：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 输入邮箱格式</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="email"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> tel:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 输入手机号码格式</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <inpt type="tel"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> url:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 输入url格式</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="url"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> number：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 输入数字格式</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="number"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> search:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 搜索框（体现语义化）</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="search"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> range:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 自由拖动滑块</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="range"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> time:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 小时分钟</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="time"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> date:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 年月日</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="date"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> datetime:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 时间</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="datetime"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> month:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 月年</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="month"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> week:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 星期 年</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="week"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> color:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 颜色</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="color"/></p>
<h1 id="b8wIi" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px">常用新属性</h1>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> placeholder：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 占位符提供可描述输入字段预期值的提示信息</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="text" placeholder="请输入用户名"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> autofocus：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 规定当页面加载时，input元素应该自动获得焦点</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="text" autofocus/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> multiple:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 多文件上传</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="file" multiple/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> autocomplete:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 规定表单是否应该启用自动完成功能，有2个值，一个是on一个是off，on代表记录已经输入的值</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 1.首先需要提交</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 2.表单必须输入信息</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 默认是on</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="text" autocomplete="off"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> required:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 必填项</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="text" required/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> accesskey:</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 规定激活（使元素获得焦点）元素的快捷键，采用alt+字母的形式</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <input type="text" accesskey="s"/></p>
<h1 id="j9ISv" style="padding: 7px 0; margin: 0; font-size: 28px; line-height: 36px">多媒体标签</h1>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 音频：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <audio src="background.mp3" autoplay controls loop="-1"></audio></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> autoplay：自动播放</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> controls：显示控件</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> loop：播放次数，若等于-1，则为无限循环</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 格式转换：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 三种格式：ogg、mp3、wav</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <audio></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <source src="bgsound.mp3"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <source src="music.ogg"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </audio></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 视频：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <video src="hh,mp4" autoplay controls weight="100" height="50"></video></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 格式转换：</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> 三种格式：ogg、mp4、webM</p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <video></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <source src="hh.mp4"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> <source src="movie.ogg"/></p>
<p style="color: rgba(38, 38, 38, 1); line-height: 24px; letter-spacing: 0.05em; outline-style: none; overflow-wrap: break-word; margin: 0"> </video></p>
<p>html:超文本标签语言,用文本表示特殊标签的语言，标签由<></>组成例子：<标签名>内容</标签名> <strong>加粗字体</strong><br>基本格式：<!DOCTYPE html> 使用的是html5版本<html> 根标签 <head> 头标签 <meta charset="UTF-8"> 字符编码方式 <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title></title> 标题标签 </head>><br> <body> </body></html><br>双标签（绝大多数）：<body>标签开始部分 </body>标签结束部分 /关闭符号单标签（一小部分）：<br /><br>嵌套关系：<html></html>是一切标签的父标签<head></head>是<title></title>的父标签如果两个标签之间是嵌套关系，子元素最好缩进一个tab身位<br>并列关系：<head></head>和<body></body>是并列关系，同一级别如果两个标签之间是并列关系，最好上下对齐<br>在vscode页面中输入！或者html：5，再按tab即可快速创建框架<br>字符集： GB2312：简体中文，包括6763个汉字 BIG5：繁体中文，港澳台地区使用 GBk：简体+繁体中文，是GB2312的扩展 UTF-8：包含全世界所有国家字符，避免出现字符集不统一而出现的乱码情况<br>标签语义化：好处： 方便阅读和维护 让浏览器能够快速解析 便于搜索引擎优化核心：合适的地方放置一个最为合理的标签<br><br>标签： 排版标签： 标题标签： 作为标题使用，依据重要性递减<h1>~<h6> <h1>标题1</h1> 段落标签： 将网页中的文字有条理的显示出来，进行分段 在浏览器中会根据浏览器布局大小自动换行 <p>段落</p> 水平线标签： 网页中使用水平线将段落与段落之间分割，使文档结构清晰 <hr /> 注意：单标签 换行标签： 可以使文本换行显示 <br /> 注意：单标签 div span标签（重点,未讲）： div span 没有语义，是网页布局的两个盒子 div是division的缩写，是分割、分区的意思 span是跨度、跨距，范围的意思 <div></div> <span></span> 文本格式化标签： 粗体： <b></b>：只是进行加粗 <strong>(推荐使用)</strong>：进行加粗的同时，强调 斜体： <i></i>:只进行倾斜 <em></em>：进行倾斜的同时，强调 加删除线： <s></s>：只是进行加删除线 <del></del>:进行加删除线的同时，强调 加下划线： <u></u>：只是进行加下划线 <ins></ins>：进行加下划线的同时，强调<br> 标签属性： <标签名 属性1="属性1" 属性2="属性2" ···>内容</标签名> 标签可以拥有多个属性，必须写在开始标签中，位于标签名后面 属性之间不分先后顺序，标签名和属性、属性和属性之间均以空格分开 任何标签的属性都有默认值，省略该属性则取默认值 采取 键值对 的格式 key = value 例：<hr width="500" color="red"/> 图像标签： 可以在网页中显示图像 注意：单标签 基本插入方式： <img src="图像URL" /> 图像的路径 带有alt的图像： <img src="图像URL" alt="这是我的1"/> 图像不能显示时的替换文本 带有title的图像： <img src="图像URL" title="这是我的2"/> 鼠标悬停时显示的内容 带有width和height的图像： <img src="图像URL" title="这是我的3" width="400"/> <img src="图像URL" title="这是我的3" height="400"/> 设置图像的宽度和高度 一般只需要宽度或高度即可，图片会自动等比例缩放 带有border的图像： <img src="图像URL" title="这是我的3" width="400"/ border="10"> 设置图像框的宽度 链接标签； anchor的缩写 <a herf="跳转目标" target="目标窗口的弹出方式">文本或图像</a> herf：用于指定连接目标的url地址 target：用于指定链接页面的打开方式，取值有self和blank两种，其中self为默认值，blank为在新窗口中打开 <a href="http://www.baidu.com">百度</a> 外部链接需要添加：http:// 内部链接直接链接内部页面名称即可：<a herf="index.html">首页</a> 如果没有确定链接目标，<a herf="#">表示暂时为一个空链接</a> 不仅仅可以创建文本超链接，网页中各种元素（图像、表格、音频、视频等都可以添加超链接 锚点定位： 第一步：使用“a herf="#id名" 链接文本 /a”创建链接文本 <a herf="#live">个人生活</a> 第二步：使用相应的id名标注跳转目标的位置 <h3 id="live">个人生活</h3> base标签： 设置整体链接的打开状态 在<head></head>中加入<base /> 注意：单标签<base /> 特殊字符标签： 空格 ：&nbsp; 小于号<：&lt; 大于号>：&gt; 和号&：&amp; 人命币￥：&yen; 版权©：&copy; 注册商标®：&reg; 摄氏度℃：&deg; 正负号±：&plusmn; 乘号×：&times; 除号÷：&divide; 平方2（上标2）：&sup2; 平方3（上标3）：&sup3; 注释标签： <!--注释内容--> 快捷键：ctrl+/ 路径： 相对路径： 1.图像文件和html文件位于同一文件夹，只需输入图像文件的名称即可 <img src="logo.gif" /> 2.图像文件位于html文件的下一级文件夹，输入文件夹名和文件名，之间用/隔开 <img src="img/img01/logo.gif" /> 3.图像文件位于html文件的上一级文件夹，在文件名之前加入../ 如果是上两级，则需要使用../../ 依次类推 <img src="../logo.gif" /> 绝对路径： D:web\img\logo.gif:不常用，只能在本机中使用 完整的网络地址：http://www.itcast.cn/images/logo.gif 列表标签： 无序列表： <ul> <li></li> <li></li> <li></li> </ul> 注意： <ul></ul>中最好只存在<li></li> <li></li>之间相当于一个容器，可以容纳所有元素 比如在<li></li>中加入<p></p> 有序列表： 按照一定顺序进行排序 <ol> <li></li> <li></li> <li></li> </ol> 自定义列表： 常用于对术语或名词进行解释和描述，定义列表的列表项前没有任何相互符号 <dl> <dt>名词1</dt> <dd>名词1解释1</dd> <dd>名词1解释2</dd> ··· <dt>名词2</dt> <dd>名词2解释1</dd> <dd>名词2解释2</dd> ··· </dl><br>表格： 基本语法： <table> 表格 <tr> 行 <td>单元格中的文字</td> 单元格 ··· </tr> ··· </table><br> 实例： <table width="500" height="300" border="1"> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> <tr> <td>4</td> <td>5</td> <td>6</td> </tr> <tr> <td>7</td> <td>8</td> <td>9</td> </tr> </table> 表格属性： border：设置表格的边框（默认“border=0”无边框） cellspacing：设置单元格与单元格边框之间的空白间距 cellpadding：设置单元格内容与单元格边框之间的空白间距 width：设置表格的宽度 height：设置表格的高度 align：设置表格在网页中的水平对齐方式（left、right、center，默认left） 表头标签： 表头一般位于表格第一行或第一列，文本加粗居中 用法：将表头标签<th></th>替换相应的单元格标签<td></td>即可 表格结构： <table width="500" height="300" border="1"> <thead> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> </thead> <tbody> <tr> <td>4</td> <td>5</td> <td>6</td> </tr> <tr> <td>7</td> <td>8</td> <td>9</td> </tr> </tbody> </table> 表格标题： <table> <caption></caption> </table> 合并单元格： 合并时要将多余的行/列删除，删除的个数=合并的个数-1 合并顺序：先上后下，先左后右 跨行合并（rowspan）： <table width="500" height="300" border="1"> <thead> <tr> <td>1</td> <td>2</td> <td rowspan="2">3</td> 2代表合并2个单元格 </tr> </thead> <tbody> <tr> <td>4</td> <td>5</td> <!--<td>6</td>-->将这个删除 </tr> <tr> <td>7</td> <td>8</td> <td>9</td> </tr> </tbody> </table> 跨列合并（colspan）： <table width="500" height="300" border="1"> <thead> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> </thead> <tbody> <tr> <td>4</td> <td>5</td> <td>6</td> </tr> <tr> <td>7</td> <td colspan="2">8</td> <!--<td>9</td>-->将这个删除 </tr> </tbody> </table>表单标签： input控件： 注意：单标签 type： text：单行文本框输入 <input type="text"/> password：密码输入框 <input type="password"/> radio：单选按钮 <input type="radio"/>男 <input type="radio"/>女 checkbox：复选框 <input type="checkbox"/>足球 <input type="checkbox"/>篮球 button：普通按钮 <input type="button" value="搜索"/> submit：提交按钮 <input type="sumbit" /> 默认“提交” <input type="sumbit" value="提交按钮"/> 也可更改 reset：重置按钮 <input type="reset" /> image：图像形式的提交按钮 <input type="image" src="1.jpg"/> file：文件域 <input type="file" /> 可以添加文件 name： 由用户自定义：控件的名称 单选框，用name来实现一组的效果 <input type="radio" name="sex"/>男 <input type="radio"/ name="sex">女 复选框 <input type="checkbox" name="hobby"/>足球 <input type="checkbox" name="hobby"/>篮球 value： 由用户自定义：input控件中的默认文本值 <input type="text" value="用户名"/> size： 正整数：input控件在页面中的显示 checked： checked：定义选择控件默认被选中的项 <input type="radio" check="checked"/>男 默认选中 maxlength： 正整数：控件允许输入的最多字符数 <input type="password" maxlength="6"/> label标签： 用于绑定一个表单元素，当点击label标签时，被绑定的表单元素就会获得输入焦点 1.用label直接进行包裹input即可 <label>输入账号：<input type="text"/></label> 2.如果label中有多个表单，想定位到某个，可以用for id的格式进行 <label for="two">输入账号：<input type="text"/> </label><input type="text" id="two"/></label> textarea控件（文本域） <textaera cols="每行的字数" row="显示的行数"> 文本内容 </textaera> 下拉菜单： <select> <option>北京</option> <option>上海</option> <option selected="selected">广州</option> 可以将这个放在第一位 </select> 表单域： action：在表单收到信息后，需要将信息传递给服务器进行处理，action属性用于指定接收并处理表单数据的服务器程序的url地址 method：用于设置表单数据的提交方式，取值为get或者post name：用于指定表单的名称，来区分同一个页面的多个表单 注意：每个表单都应该有自己的表单域 <form action="url地址" method="提交方式" name="表单名称"> 各种表单控件 </form>常用新标签： 可在w3c手册中文官网：http://w3school.com.cn/查看 header：定义文档的页眉 nav：定义导航栏链接部分 footer：定义文档或节的页脚 article：定义文章 section：定义文档中的节 aside：定义其所处内容之外的内容，侧边 datalist：标签定义选项列表，与input元素搭配使用 <input type="test" value="输入" list="1"/> <datalist id="1"> <option>11</option> <option>12</option> </datalist> filedset：元素可将表单内的相关元素分组，打包，与legend搭配使用 <filedset> <legend>用户登录</legend> 用户名：<input type="test"/> </filedset>新增input type属性值： email： 输入邮箱格式 <input type="email"/> tel: 输入手机号码格式 <inpt type="tel"/> url: 输入url格式 <input type="url"/> number： 输入数字格式 <input type="number"/> search: 搜索框（体现语义化） <input type="search"/> range: 自由拖动滑块 <input type="range"/> time: 小时分钟 <input type="time"/> date: 年月日 <input type="date"/> datetime: 时间 <input type="datetime"/> month: 月年 <input type="month"/> week: 星期 年 <input type="week"/> color: 颜色 <input type="color"/>常用新属性： placeholder： 占位符提供可描述输入字段预期值的提示信息 <input type="text" placeholder="请输入用户名"/> autofocus： 规定当页面加载时，input元素应该自动获得焦点 <input type="text" autofocus/> multiple: 多文件上传 <input type="file" multiple/> autocomplete: 规定表单是否应该启用自动完成功能，有2个值，一个是on一个是off，on代表记录已经输入的值 1.首先需要提交 2.表单必须输入信息 默认是on <input type="text" autocomplete="off"/> required: 必填项 <input type="text" required/> accesskey: 规定激活（使元素获得焦点）元素的快捷键，采用alt+字母的形式 <input type="text" accesskey="s"/>多媒体标签： 音频： <audio src="background.mp3" autoplay controls loop="-1"></audio> autoplay：自动播放 controls：显示控件 loop：播放次数，若等于-1，则为无限循环 格式转换： 三种格式：ogg、mp3、wav <audio> <source src="bgsound.mp3"/> <source src="music.ogg"/> </audio> 视频： <video src="hh,mp4" autoplay controls weight="100" height="50"></video> 格式转换： 三种格式：ogg、mp4、webM <video> <source src="hh.mp4"/> <source src="movie.ogg"/> </video></p><br><br>
来源：https://www.cnblogs.com/oldwangcy/p/11390700.html
頁:
[1]