Html 标签 -列表，表格，表单

无序列表：
 ul li嵌套关系的 ul里面可以包含多个li
ul 里面不可以包含其他的内容 是不符合规范的， li里面可以包含其他的内容
例：<ul>
<li>这是列表的第一列</li>
<li>这是列表的第一列</li>
<li>这是列表的第一列</li>
<li>这是列表的第一列</li>
<li>这是列表的第一列</li>
</ul>

有序列表:
ol li 可以包含多个li
type:列表的类型 默认是数字1 可以改成字母和罗马数字
例：<ol>
    <li>李四</li>
<li>王五</li>
<li>赵六</li>
<li>田七</li>
</ol>

自定义列表 ：
dl 自定义列表
dt:这个列表的主题 只有一个
dd:列表的每一项 可以有多项
例：
<dl>
<dt>分类</dt>
<dd>服装</dd>
<dd>数码</dd>
<dd>鞋子</dd>
</dl>

表格：
table 表格标签
属性：border:表示的是边框
width:表示表格的宽度
height:表格的高度
 cellspacing：表格单元格之间的距离
cellpadding:单元格与内容之间的距离
align:表格的对齐方式
   tr:表示表格的行
td:表格的单元格
          th:表格的标题单元格
          rowspan：跨行属性
          colspan：跨列属性

表格结构：
表格的头部 thead
表格的主体 tbody
表格的脚部 tfoot
例如：
<table border="1" width="600" height="300" cellspacing="0" align="center">
<thead>
<tr>
<th>星期一</th>
<th>星期二</th>
<th>星期三</th>
<th>星期四</th>
<th>星期五</th>
<th>周末</th>
</tr>
</thead>
<tbody>
<tr>
<td>JAVA</td>
<td>CSS</td>
<td>PYTHON</td>
<td>PHP</td>
<td>NODE</td>
<td rowspan="2">休息</td>
</tr>
<tr>
<td>HTML</td>
<td>.NOT</td>
<td>C++</td>
<td>C#</td>
<td>JS</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="6">总计课时:10</td>
</tr>
</tfoot>
</table>

表单：用来收集用户相关的信息
          input:表单标签 重点
属性：type:表单的类型 重点
属性值：text 文本款 重点
password 密码框 重点
submit 提交按钮 重点
reset：重置按钮
button：最终需要配合js一起来使用 现在没有任何功能 重点
radio:单选框 name值必须取 并且名字是必须相同的 重点
checkbox:复选框（多选框） 重点
file:文件域 重点
image:以图片的形式实现提交功能
email:可以进行邮箱的验证
search:搜索框 自带清除功能
url:验证表单内容是否是一个符合规范的网址
tel:pc端看不来效果，移动端可以看效果，手机的键盘弹出的时候只有数字
        name:给表单起一个名字(记这里)，并且在提交给后端的时候 会把name的值 当做属性 输入的内容当做值提交过去
               value:表示是表单额值
             checked:默认选中单选按钮或者复选框
        required:必须有值 没值不能提交表单会报警告
        minlength:最少输入的字符
       maxlength:最多输入的字符长度
         placeholder:提示用户输入的内容\
          autocomplete:自动填充 on 开启自动填充 off 关闭自动填充
          autofocus:自动获取焦点
            readonly：只读属性
            disabled:禁用表单
         multiple:可以多选 file身上可以使用 select身上也能使用
        date：日期 年月日
         time:时间 小时分钟
         datetime-local:日期和时间 包含了年月日 小时分钟
         month:年月
          week:年月+第几周
         color:颜色
         number:数字表单 max 当前最大的数字值 min 当前最小的数字值
         range:滑块
       value:当前所占的值有多大 max：最大值是多少

               form表单域：标签的区域
             action:提交表单的地址(做了解)
              button：按钮标签 功能很多 基本配合js一起使用
              textarea:文本域
            rows：文本域的行
              cols：文本域的列
               select:下拉列表
            option:下拉列表里面的选项
           selected:默认选中的那一项
                label:可以用来和表单进行关联
             for:需要和表单中的id是一致的 那么就能实现关联、
                fieldset：表单区域
              legend：区域的标题
                      hidden表单 隐藏域
               作用 ：该表单时看不到的 当用户在提交表单内容的时候，我们可以规定它默认提交一些信息
例如：
<form action=" http://www.baidu.com">
<fieldset>
<legend>注册表单</legend>
滑块:<input type="range" value="20" max="100" />
数字:<input type="number" max="20" min="0" /> <br><br>
颜色:<input type="color" /> <br><br>
周期:<input type="week" /><br><br>
年月:<input type="month" /><br><br>
日期和时间:<input type="datetime-local" /><br><br>
时间:<input type="time" /><br><br>
日期:<input type="date" /><br><br>
电话:<input type="tel" /><br><br>
url:<input type="url" /><br><br>
搜索：<input type="search" /> <br><br>
邮箱:<input type="email" />
<br><br>
用户名:<input type="text" name="username" value="张三" autofocus autocomplete="off" placeholder="请输入用户名" required
minlength="3" maxlength="10" readonly /> <br><br>
<label for="pwd">密码:</label> <input type="password" id="pwd" name="pwd" value="" required minlength="3" />
<br><br>
请选择性别: <input type="radio" name="gender" value="1" id="b" /><label for="b">男</label>
<input type="radio" name="gender" value="0" checked id="g" /><label for="g">女</label>
<br><br>
您的爱好是什么:
<input type="checkbox" name="likes" value="hj" disabled /> 喝酒
<input type="checkbox" name="likes" value="cy" checked /> 抽烟
<input type="checkbox" name="likes" value="tt" checked /> 烫头
<input type="checkbox" name="likes" value="sxs" /> 说相声<br><br>
请选择头像:<input type="file" multiple /> <br><br>
请输入您的个人宣言：<textarea rows="5" cols="20"></textarea><br><br>
请选择城市:
<select name="city" multiple>
<option value="sz">深圳</option>
<option value="gz" selected>广州</option>
<option value="dg">东莞</option>
<option value="zh">珠海</option>
</select>
<br><br>
<br><br>
<input type="submit" value="注册" />
<input type="reset" value="清空" />
<input type="button" value="普通按钮" />
<button>按钮标签</button>
<input type="image" src="btn.png" />
</fieldset>
</form>
hidden隐藏域：
<form action=" http://www.baidu.com">
姓名：<input type="text" name="user"/>
密码：<input type="password" name="pwd"/>
<input type="hidden" name="cookie" value="abcdefg"/>
<button>登录</button>
</form>