新的一天又开始了，今天学习了三个内容
一、表格标签 table
在各个网页中我们会发现许多商品页面，展示是用什么来展示的呢，表格无疑是一种不错的选择看下图。
一张常见的简历就是有表格标签来编写的
创建表格：
<table>
<tr>
<td>td>
tr>
<tr>
<td>td>
tr>
table>
表格其他标签：
<thead>我是表格的头部thead> <tbody>我是表格的身体tbody> <tfoot>我是表格的尾部tfoot>
这三个标签作用是来区分表格的表头，身体，和注脚，tfoot不常用 除此之外还有 th 标签代表表头，可以达到字体加粗的作用
表格属性：
width：表格的宽 默认值随表格内容而变化；
hight：表格的高，默认值随表格内容变化；
cellpadding：设置单元格中内容与单元格的边距 默认为1px；
cellspacing：设置单元格与单元格之间的距离 默认为2px（因为一共单元格边距为1，两个就是2）；
align：设置表格对齐方式，有左对齐 居中对齐 右对齐，默认为作对齐（根据父元素来对齐）；
boder：设置表格的边框，默认为0；
此外还有很多属性可以参考：https://www.w3school.com.cn/html/html_tables.asp
表格合并：
有两种合并方式，跨列合并和跨行合并
- 跨列合并：colspan="合并单元格的个数"
下面有一个表格的综合案例（个人简介）： 看完表格后，和做Excel表格是一个道理，只不过实现方法不同，我们是用代码来实现，以后的表格我将会越写越精彩。
<div> <table border="1" cellpadding="0" cellspacing="0" width="800px" height="aout" align="center" style="text-align: center;"> <caption><strong>个人简历<br> <br>strong> caption> <tr style="height: 40px;"> <td><strong>姓名：strong> td> <td>张三td> <td><strong>电话：strong> td> <td>17683500636td> <td rowspan="3" colspan="5"><img src="" alt="未加载" width="150px" height="200px" title="图片未加载">td> tr> <tr style="height: 40px"> <td><strong>年龄：strong> td> <td>18td> <td><strong>地址：strong> td> <td>中国td> tr> <tr style="height: 40px"> <td><strong>QQ：strong> td> <td>29110545039td> <td><strong>邮箱：strong> td> <td>[email protected]td> tr> <tr style="height: 180px;"> <td><strong>学<br>习<br>经<br>历strong> td> <td colspan="6">100字以上td> tr> <tr style="height: 180px;"> <td><strong>工作经历strong> td> <td colspan="6">100字以上td> tr> <tr style="height: 180px;"> <td><strong>学习成就strong> td> <td colspan="6">100字以上td> tr> <tr style="height: 180px;"> <td><strong>自我评价strong> td> <td colspan="6">100字以上td> tr> table> div>
========================================_================================================
二、列表标签 ul，ol
列表的使用很广泛，但是使用简单，并不花里胡哨，花里胡哨的是css样式，经过css的修饰，列表标签将会成为网页的主力军
ul：无序列表无序列表顾名思义就是不会标明顺序。如下
<ul> <li>我是无序列表1li> <li>我是无序列表2li> <li>我是无序列表3li> <li>我是无序列表4li> <li>我是无序列表5li> ul>
ol：有序列表，它会有1,2,3等排序
<ol> <li>我是有序列表1li> <li>我是有序列表2li> <li>我是有序列表3li> <li>我是有序列表4li> <li>我是有序列表5li> ol>
列表有一个常用的属性 type：（下面是无序列表）
| disc | 默认值。实心圆。 |
| circle | 空心圆。 |
| square | 实心方块。 |
下面是有序列表 type=“1”：
| 值 | 描述 |
|---|---|
| 1 | 默认值。数字有序列表。（1、2、3、4） |
| a | 按字母顺序排列的有序列表，小写。（a、b、c、d） |
| A | 按字母顺序排列的有序列表，大写。（A、B、C、D） |
| i | 罗马字母，小写。（i, ii, iii, iv） |
| I | 罗马字母，大写。（I, II, III, IV） |
====================================================_===================================================
三、表单标签from
在各大网站中，我们总会看到各式各样的登录或者注册页面，这类的表单有from标签编写，from能向后台提交数据与后台达成交互的作用。
而form标签内是各式各样的标签，其中input标签是最最使用频繁的。
input写法
<form action="" method=""> <input type="" name="" id="" value="" /> form>
可以看见input 主要有 type属性 name 属性 value属性 id 属性
type 的属性有很多，在html5后又添加了些许：
| button | 定义可点击按钮（多数情况下，用于通过 JavaScript 启动脚本）。 |
| checkbox | 定义复选框。 |
| file | 定义输入字段和 "浏览"按钮，供文件上传。 |
| hidden | 定义隐藏的输入字段。 |
| image | 定义图像形式的提交按钮。 |
| password | 定义密码字段。该字段中的字符被掩码。 |
| radio | 定义单选按钮。 |
| reset | 定义重置按钮。重置按钮会清除表单中的所有数据。 |
| submit | 定义提交按钮。提交按钮会把表单数据发送到服务器。 |
| text | 定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。 |
name：属性的作用是让两个input为一组，让浏览器好区别
value：value是为input标签添加值
id： 唯一认证
其他标签：
文本域标签：textarea https://www.runoob.com/tags/tag-textarea.html
下拉列表标签：select https://www.w3school.com.cn/tags/tag_select.asp
from表单域：
<form action="url地址" method="提交方式" name="表单名称"> 各种表单控件 form>
下面有一个综合案例：
<div>
<form action="">
<table align="center" style="text-align: left;" width="700px" cellpadding="5px">
<caption><strong>青春不常在 抓紧谈恋爱 <br><br>strong>caption>
<tr>
<td>性别td>
<td>
<input type="radio" name="sex"> <img src="img/man.jpg" alt=""><span>男span>
<input type="radio" name="sex"> <img src="img/women.jpg" alt=""><span>女span>
td>
tr>
<tr>
<td>生日td>
<td>
<select>
<option value="请选择年份">请选择年option>
<option value="2019">2019option>
<option value="2018">2018option>
<option value="2017">2017option>
select>
<select>
<option value="请选择年份">请选择月option>
<option value="2019">10option>
<option value="2018">11option>
<option value="2017">12option>
select>
<select>
<option value="请选择年份">请选择日option>
<option value="2019">2019option>
<option value="2018">2018option>
<option value="2017">2017option>
select>
td>
tr>
<tr>
<td>所在地区td>
<td>
<input type="text" value="" placeholder="请输入居住地">
td>
tr>
<tr>
<td>婚姻状况td>
<td>
<input type="radio" name="marital_status "><span>未婚span>
<input type="radio" name="marital_status "><span>未婚span>
<input type="radio" name="marital_statuss "><span>离异span>
td>
tr>
<tr>
<td>学历td>
<td>
<input type="text" name="" id="" value="小学" placeholder="请输入学历">
td>
tr>
<tr>
<td>月薪td>
<td>
<input type="number" value="3000" placeholder="请输入工资">
td>
tr>
<tr>
<td>手机号td>
<td>
<input type="tel" value="" placeholder="请输入手机号">
td>
tr>
<tr>
<td>昵称td>
<td>
<input type="text" value="" placeholder="请输入昵称">
td>
tr>
<tr>
<td>喜欢的类型td>
<td>
<input type="checkbox" name="t_like"><span>妩媚span>
<input type="checkbox" name="t_like"><span>可爱span>
<input type="checkbox" name="t_like"><span>性感span>
<input type="checkbox" name="t_like"><span>唯美span>
<input type="checkbox" name="t_like"><span>气质span>
<input type="checkbox" name="t_like"><span>高冷span>
td>
tr>
<tr>
<td rowspan="2">自我介绍td>
<td>
<textarea name="" id="" cols="40" rows="10">textarea>
td>
tr>
<tr>
<td colspan="2" align="">
<input type="image" src="img/btn(1).png">
td>
tr>
<tr>
<td rowspan="4">td>
<td colspan="2" align="">
<input type="checkbox"> <span style="color: blue;">我同意注册协议span>
td>
tr>
<tr>
<td colspan="2" align="">
<a href="">我是会员，立即登录a>
td>
tr>
<tr>
<td colspan="2"><strong>我承诺strong>td>
tr>
<tr>
<td colspan="2" align="">
<ul style="margin: 0;">
<li>年满18岁li>
<li>抱着严肃的态度li>
<li>认真寻找另一半li>
ul>
td>
tr>
table>
form>
div>
个人学习，内容简略。
我是表格的头部
我是表格的身体我是表格的尾部