常用标签
1.标题标签(h1-h6)
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<!-- 常用的标题标签是前4个:h1-h4 -->
2.段落标签(p):paragraph
<p>段落内容</p>
<p>这是段落1</p>
<p>这是段落2</p>
<!-- p标签内不能放块标签 -->
3.块和行内元素
<!-- 块级元素：对页面进行布局
行内元素：通常用来设置样式b、em、strong
块级标签内可以放任何标签，p除外
p中不能放任何标签 -->
<!-- 块级元素： div、p、h1-h6、form、ul、ol、dl、dt、dd、li、table、tr、td、th、hr
行内元素： span、img、a、label、input、em、b、big、i、q、textarea、select、small、sub、sup，strong、u -->
<p>
<div>
test
</div>
</p>
<!-- span：没有什么语义，单独设置样式 -->
<p>1111111<span style="color:red;">这是一个span</span>111</p>
4.结构化标签(布局)
header
main
footer
nav:导航
aside：批注(和主体相关的其他内容)，侧边栏
section：没有以上标签合适的语义时，可以使用section，表示一个独立的区块
显示相同
5.列表(3)
<!-- 5.1无序列表 -->
<ul>
<li>1<>
<li>2<>
<li>3<>
<li>4<>
</ul>
<!-- 5.2有序列表 -->
<ol>
<li>1<>
<li>2<>
<li>3<>
<li>4<>
<li>5<>
</ol>
<!-- 5.3定义列表 -->
<!-- description list -->
<dl>
<dt>操作系统</dt>
<dd>操作系统是一组能有效组织和管理计算机硬件和软件资源。。。的集合</dd>
<dl>
相对路径
<!-- 相对路径
./:表示当前文件所在目录(省略不写)
../：当前文件所在目录的上一级
-->
6.img图片标签
<!-- 6.图片img标签
属性：
src：图片地址
alt：加载不出来时显示的文字
title：鼠标滑过时,显示的文字
-->
<img src="./path/QQ图片20210327180908.png" alt="图片1" title="pic">
7.a超链接标签
<!-- 属性：
href跳转
①外部网址
②内部页面
target:
①_self
②_blank
-->
<a href="https://www.baidu.com" target="_blank">百度</a>
8.表格
<!-- 8.1
table:表格标签
caption:表头
tr:table row，表格的行
th:表格的标题
td:表格的列元素
-->
<table border="1">
<caption>表头</caption>
<tr>
<th>html</th>
<th>css</th>
<th>js</th>
</tr>
<tr>
<td>1天</td>
<td>2天</td>
<td>3天</td>
</tr>
</table>
<!-- 8.2 创建表格的三个区域
thead：表头 表格头部,一般放<tr>和<th>标签。
tbody：表身 表格内容,一般放<tr>和<td>标签。
tfoot：表尾 表格脚部标注,一般放<tr>和<td>标签。
-->
<table border="1">
<thead>
<tr>
<td>科目</td>
<td>分数</td>
</tr>
</thead>
<tbody>
<tr>
<td>语文</td>
<td>111</td>
</tr>
<tr>
<td>数学</td>
<td>121</td>
</tr>
<tr>
<td>英语</td>
<td>130</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>总分</td>
<td>362</td>
</tr>
</tfoot>
</table>
9.表单标签
<form method="传送方式" action="服务器文件"></form>
<!--input
type:text(文本)、password(密码)、number(数字)、url(网址)、email(邮箱)
name：为文本框命名，以备后台程序ASP 、PHP使用。
value：为文本输入框设置默认值。(一般起到提示作用)
placeholder:提示
-->
<!-- 9.2.1 text-->
<input type="text" placeholder="ddd">
<!-- 9.2.2 password:··· -->
<input type="password">
<!-- 9.2.3 number:只能输入数字，调整数字大小-->
<input type="number">
<!-- 9.2.4 url:数字框的值需以http://或者https://开头,且后面必须有内容,否则表单提交的时候会报错误提示。-->
<!-- 9.2.5 email:数字框的值@之后必须有内容,否则会报错误提示 -->
<!-- 9.2.6 textarea:文本域 -->
<textarea name="" id="" cols="30" rows="10"></textarea>
<!-- 9.2.7 label:
for:控件id名称
-->
<label for="id"></label>
<input type="text" id="id">
<!-- 9.2.8 单选框、复选框 -->
<!-- 单选框 -->
<label>性别：</label>
<label>女：</label>
<input type="radio" value="1" name="gender">
<label>男：</label>
<input type="radio" value="2" name="gender">
<br>
<!-- 复选框 -->
<label>你喜欢的饮料有哪些？</label>
<label>可乐</label>
<input type="checkbox" value="1" name="drink">
<label>橙汁</label>
<input type="checkbox" value="2" name="drink">
<label>小茗同学</label>
<input type="checkbox" value="3" name="drink">
<!-- 9.2.9下拉菜单 select-->
<select>
<!-- value:向服务器提交的值 显示的值 selected默认被选中 -->
<option value="read">读书</option>
<option value="run" selected="selected">跑步</option>
<option value="shop">购物</option>
<select>
<!-- 9.2.10 提交按钮 -->
<input type="submit" value="提交">
<!-- 9.2.11 重置按钮 -->
<form action="">
<input type="text" placeholder="ddd">
<input type="reset" value="重置">
</form>
