一 列表
1 无序列表 ul li
2 有序列表 ol li
3 定义列表 dl dt表示被定义的内容 dd表示对定义内容的描述
dl ul ol 之间可以互相嵌套
二 表格标签
<table></table>
表格标签，用于在效果中定义一个表格
<tr></tr>
表格的行标签，用于定义一个表格行
<td></td>
表格的单元个标签，用于定义一个表格行中的单元格
<th></th>
表格的表头单元格标签，用于在效果中定义一个表格红中的单元格
<th><td>唯一区别：<th>居中加粗
单元格合并
<td>或者<th>都有两个单元格合并属性：
colspan:跨列合并单元格
rowspan:跨行合并合单元格
合并步骤：
1 确定合并哪几个单元格，确定是跨行合并还是跨列合并
2 在第一个出现的单元格上书写合并单元格属性
3 合并几个单元格，属性就写几
4 被合并的单元格必须删掉
行 列 单元格 表头 数据
表格是为了更好的格式化显示数据
三 内联与块标签
<span></span>
内联标签，一行上定义多个元素，进行内容显示
有多少个内容，就会占用多大空间
span不会自动换行
<div></div>
块标签，一行上定义一个块，默认沾满一行，进行内容显示
适用于大量数据展示，或者用来布局
四表单标签
<from></from>
用于在效果中定义一个表单
作用：用于提交用户填写的数据，提交给服务器的程序
文本框供用户输入，类是Java的Scanner
action 将数据提交到何处
默认提交到本页
本机内网路径
相对路径：常用
绝对路径：不建议使用
互联网路径：https://www.12306.com/xxx
method 将数据一何种方式提交
默认为get
提交方式课定义为get或者post
get方式提交特点：把数据拼接到地址栏上
post方式提交特点：没有把数据拼接到地址栏上而是在请求体
get和post提交方式区别：
1 get提交的参数列表拼接到地址栏后面；post方式不会拼接到地址栏后面
2 get提交数据，敏感信息不安全，post方式提交的数据相对安全
3 get方式提交的数据是有限的，post方式从理论上提交的数据是无限大的
尽量使用post方式提交表单
五 输入项标签
<input></input>
表单输入项标签，用户可以在该标签上，通过填写和选择，进行数据的输入
type设置该标签的种类
text密码框，内容非明文
password单选框，在同一组内有单选效果
chechbox复选框，在同一组内有复选效果
submit提交按钮，用于控制表单提交数据
reset 充值按钮，用于表单输入项恢复到默认状态
file附件框，用于文件上传
hidden隐藏于，一般用作提交服务器需要拿到，单用户不需要看到的数据
button普通按钮，需要和js时间一起用
name 单选框，复选框进行数据的分组，设置该标签对应的参数名，要提交数据给后台，必须写name
value设置该标签对应的参数值/作为按钮的名字
checked设置单选框/复选框的默认选中状态
readonly设置该标签的参数值只读，用户无法手动更改，数据是可以正常提交的
disabled设置该标签不可用，参数值无法更改，并且无法提交
六 表单点击提交按钮，提交数据时
url？参数列表
参数列表格式：参数1=参数值&参数2=参数值&参数3=参数值......
？gender=on on表示选中
？gender=male&age=18......
单选框，用户只能选择，不能输入，需要制定value属性
文本框，用户可以自由输入，不一定指value属性，指定的话表示默认值，placeholder表示提示文字
七选择框标签
<select></select>标签，定义一个下拉选择框
name设置该标签对应的参数名
multiple设置选项全部显示，并且可以进行多选提交，不屑此属性默认为单选
<option></option>标签，选项标签，为一个选择框添加一个选项
value设置需要提交的参数值
selected设置选项的默认选中状态
注意事项：
option的内容体一般是用来展示的
参数值应该时option的value属性值
八文本域标签
<textarea></textarea>标签
文本域，多行文本框
name设置该标签对应的参数名
文本与和文本框区别
1 文本框不能换行，文本域可以
2 文本框参数值是value属性，文本域参数值是标签的内容体
九 提交表单注意事项
提交中文问题
为什么使用URL编码
正常提交？pwd=123&uname=zhangsan
非正常？pwd=123#asd&qwe&sdf&uname=zhangsan
URL编码解决方式：特殊符号，中文近些编码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册网站</title>
</head>
<body>
<form action="NewFile1.html">
<!--用户名ID -->
<input type="hidden" name="uid" vlaue="123">
照片<input type="file" name="photo"><br><br>
用户名<input type="text" name="username" value="李赫桐"><br><br>
密码<input type="password" name="password" placeholder="提示数字"><br><br>
性别<input type="radio" name="gender" value="male" checked="checked">男
<input type="radio" name="gender" value="female">女<br><br>
年龄<input type="radio" name="age" value="wcn">未成年
<input type="radio" name="age" value="cn" checked="checked">成年<br><br>
所在省份<select name="sf">
<option value="ln">辽宁省</option>
<option value="hb">河北省</option>
<option value="sx">山西省</option>
<option value="jl">吉林省</option>
<option value="hlj">黑龙江省</option>
<option value="js">江苏省</option>
<option value="zj">浙江省</option>
<option value="ah">安徽省</option>
<option value="gx">广西壮族自治区</option>
</select><br><br>
手机号<input type="phone" name="phone">
<input type="button" value="获取验证码"><br><br>
输入验证码<input type="yzm" name="yzm"><br><br>
爱好<input type="checkbox" name="hobby" value="wzry" checked="checked">王者荣耀
<input type="checkbox" name="hobby" value="mn" checked="checked">美女
<input type="checkbox" name="hobby" value="dy">电影
<input type="checkbox" name="hobby" value="eat">吃<br><br>
你喜欢的明星
<select name="star">
<option value="lht">李赫桐</option>
<option value="cwt">陈伟霆</option>
<option value="qbl">乔碧萝</option>
<option value="cxk">蔡徐坤</option>
<option value="yyp" selected="selected">岳云鹏</option>
</select><br><br>
自我介绍<textarea name="info"></textarea><br><br>
<input type="submit" value="注册">
<input type="reset" name="">
<input type="button" value="按钮"><br><br>
<button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">按钮</button>
</form>
</body>
</html>
