1. HTML的书写规范
<html>
<head>
<title>test-2021-1-8</title>
</head>
<body>
<!-- 里面写内容-->
</body>
</html>
标签总的来说有两个属性：基本属性和事件属性
基本属性可以修改简单的样式效果；事件属性可以直接设置事件响应后的代码。
2. body里面的常用标签
1.font
字体标签，有三个基本属性，分别修改文本的颜色color、字体face、大小size
<font color="red" face="宋体" size="2">我是陆亿行</font>
2. h1到h6
标题标签，h1最大，h6最小，有基本属性align，有三个不同的取值：
left 左对齐；center 居中；right 右对齐
<h1 align="center">我是大标题，标题1</h1>
3. a
超链接，有两个基本属性：href 和 target
href属性设置跳转的地址
target属性决定是在本页面跳转还是打开新页面跳转，对应的取值为_self和_blank，默认取值_self
<a href="http://www.baidu.com">我是超链接，牺牲我自己</a> <br/>
<a href="http://www.baidu.com" target="_blank">我是超链接，新开网页</a>
4.ul ol
列表标签
ul——unorder list 无序列表
ol——order list 有序列表
其中ul列表有type属性，可以修改列表项前面的符号。
<ol>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
<li>ddd</li>
</ol>
<ul>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
<li>ddd</li>
</ul>
5.img
图片标签，是个单标签
src属性设置图片的路径，相对路径和绝对路径
width height 分别设置图片的宽度和高度
border设置图片的黑色边框的粗细
绝对路径要使用 http://ip:port/工程名/资源路径 这样的形式，避免换电脑后找不到文件，而不能使用盘符:/目录/文件名
<img src="./壁纸1.jpg" width="300" height="260" border="1" alt="NotFound"/>
6. table
表格标签
tr是行标签，td是单元格标签，表示该行的一个个单元格
有border、width、height、align已经见过的属性，还有cellspacing标签，设置单元格间距，即表示单元格和单元格之间的距离。
<table width="300" height="300" border="1" align="center" cellspacing="2">
<tr>
<td align="center"><b>字母</b></td>
<td align="center"><b>数字</b></td>
<td align="center"><b>字符</b></td>
</tr> <!--表头作用-->
<tr> <td>a</td> <td>1</td> <td>!</td> </tr>
<tr> <td>b</td> <td>2</td> <td>?</td> </tr>
</table>
所以设置一个th标签，简化< td align=“center” >< b >，作为表头标签：
<table width="300" height="300" border="1" align="center" cellspacing="0">
<tr>
<th>字母</th>
<th>数字</th>
<th>字符</th>
</tr>
<tr> <td>a</td> <td>1</td> <td>!</td> </tr>
<tr> <td>b</td> <td>2</td> <td>?</td> </tr>
</table>
跨行跨列表格
对于M×N的表格，其中一个单元格可以不仅仅占一行一列，而是m行n列，这里m和n还要受限于M和N
colspan属性和rowspan属性
<table width="300" height="300" border="1" align="center" cellspacing="0">
<tr>
<th>小字</th>
<th>数字</th>
<th>字符</th>
<th>大字</th>
</tr>
<tr> <td colspan="2" rowspan="3">a1</td> <td>!</td> <td>A</td></tr>
<tr> <td>?</td> <td>B</td></tr>
<tr> <td>@</td> <td>C</td></tr>
<tr> <td>d</td> <td>4</td> <td>#</td> <td>D</td></tr>
</table>
7. form
表单标签
| input标签 ：单行文本框输入，单标签 | |
|---|---|
| type=“text” 文本输入框 | value=" ×××" 默认显示内容 |
| type=“password” 密码输入框 | value=" ×××" 默认显示内容 |
| type=“radio” 单选框(同一组内的只能进行单选） | name=" ×" 以×为单位分组,防止多选 checked=“checked” 表示默认选中××取值 |
| type=“checkbox” 复选框 | checked=“checked” 表示默认选中×× |
| type=“reset” 重置按钮 | value=" ××" 在重置按钮上显示的内容 |
| type=“submit” 提交按钮 | value=" ××" 在提交按钮上显示的内容 |
| type=“button” 按钮 | value=" ××" 在按钮上显示的内容 |
| *type=“file” 文件上传域 | |
| *type=“hidden” 隐藏域 | 当要发送某些信息，且信息不需要用户参与时，就可以使用隐藏域，提交的同时发送给服务器 |
| textarea标签： 多行文本输入框 | |
|---|---|
| < textarea > 我是默认值< /textarea> | 文本框中的内容是默认值 |
| 属性rows | 设置文本框最多显示的行数 |
| 属性cols | 设置文本框最多显示的列数(字符个数) |
| select标签：下拉列表框 | |
|---|---|
| option标签：< option > < /option > | 列出每一个待选项 |
| option标签的属性：selected=“selected” | 默认选中 |
<form>
用户名称：<input type="text" value="default"/> <br/>
用户密码：<input type="password"/> <br/>
确认密码：<input type="password"/> <br/>
性别：<input type="radio" name="sex"/>男
<input type="radio" name="sex" checked="checked"/>女 <br/>
兴趣爱好：<input type="checkbox" checked="checked"/>Java
<input type="checkbox" checked="checked"/>C++
<input type="checkbox"/>Linux
<input type="checkbox"/>JSP <br/>
国籍：<select>
<option selected="selected">----请选择国籍-----</option>
<option>美国</option>
<option>中国</option>
<option>法国</option>
</select> <br/>
<br/>
自我评价：<textarea rows="10" cols="20"> 我是默认值</textarea> <br/>
<br/>
<input type="reset" value="重置按钮"/>
<input type="submit" value="提交按钮"/>
</form>
上面的例子中只是一个表面形式的表单，不能用于提交发给服务器，当表单进行提交时，需要给每个标签一个name属性(相当于变量名)，在输入部分的数值相当于变量的取值。
美化表单,在表单里添加一个table表格；
表单提交给服务器时，需设置表单的两个属性action和method
form标签有两个基本属性 action method
action 属性设置提交的服务器地址 ；method 属性设置提交的方式 GET(默认值)或 POST
表单提交的时候，数据没有发送给服务器的三种情况：
- 表单项没有 name 属性值
- 表单项不在提交的 form 标签中
- 单选、复选（下拉列表中的 option 标签）需要额外添加 value 属性，以便发送给服务器，否则服务器只会收到on(选中) off(不选中)的信息，而不知道的具体的信息
http:// localhost:8080 / 服务值地址
? 分隔符
username=lyh&password=abc&password=abc&sex=girl&hobby=java&hobby=js&conutry=china&desc=aabb 请求参数，即表单信息，用&间隔开
请求参数的格式： name=value & name =value
（对于radio、checkbox、select中的option，请求参数name=on或者name=off，为了知道是什么，通常用value属性的值代替on或者off，而对于text、password等的value值就是单纯指默认值）
<form action="http://localhost:8080" method="get">
<h1 align="center">用户注册</h1>
<table align="center">
<tr>
<td> 用户名称：</td>
<td>
<input type="text" value="默认值" name="username"/>
</td>
</tr>
<tr>
<td> 用户密码：</td>
<td><input type="password" value="abc" name="password"/></td>
</tr>
<tr>
<td>确认密码：</td>
<td><input type="password" value="abc" name="password"/></td>
</tr>
<tr>
<td>性别：</td>
<td>
<input type="radio" name="sex" value="boy"/>男
<input type="radio" name="sex" value="girl" checked="checked" />女
</td>
</tr>
<tr>
<td> 兴趣爱好：</td>
<td>
<input type="checkbox" name="hobby" checked="checked" value="java"/>Java
<input type="checkbox" name="hobby" value="js"/>JavaScript
<input type="checkbox" name="hobby" value="cpp"/>C++
</td>
</tr>
<tr>
<td>国籍：</td>
<td>
<select name="conutry">
<option value="none">--请选择国籍--</option>
<option selected="selected" value="china">中国</option>
<option value="USA">美国</option>
<option value="japan">日本</option>
</select>
</td>
</tr>
<tr>
<td>自我评价：</td>
<td><textarea rows="10" cols="20" name="desc">我是默认值</textarea></td>
</tr>
<tr>
<td><input type="reset"/></td>
<td align="center"><input type="submit"/></td>
</tr>
</table>
</form>
div 标签
默认独占一行
span 标签
它的长度是封装数据的长度
p 段落标签
默认会在段落的上方或下方各空出一行来（如果已有就不再空）
<div>div标签1</div>
<div>div标签2</div>
<span>span标签1</span>
<span>span标签2</span>
<p>段落标签1</p>1
<p>段落标签2</p>2