eg：

第一行第一列
第一行第二列
第二行第一列
第二行第二列

        1. 为表格加边框：

第一行第一列
第一行第二列
第二行第一列
第二行第二列

        2. caption 元素定义表格标题： 

表格标题
第一行第一列
第一行第二列
第二行第一列
第二行第二列

         3. 给表格添加表头：

支出表
支出
备注
32
买苹果
24
买饮料

        4. 表格与单元格的属性： 

 1.2 div设置

        在网页中可以使用很多个 div，在网页制作中，使用 div 可以将网页中的任何元素布局到网页中的任何位置。

table 元素布局：

• 优点：

1. 理解比较简单。
2. 不同的浏览器看到的效果一般相同。

• 缺点：

1. 显示样式和数据绑定在一起。
2. 布局的时候灵活度不高。
3. 一个页面可能会有大量的 table 元素，代码冗余度高。
4. 增加带宽。
5. 搜索引擎不喜欢这样的布局。

div 元素布局：

• 优点：

1. 符合 W3C 标准。
2. 搜索引擎更加友好。
3. 样式的调整更加方便，内容和样式的分离，使页面和样式的调整变得更加方便。
4. 节省代宽，代码冗余度低。
5. 表现和结构分离，在团队开发中更容易分工合作而减少相互关联性。

1.3 小节挑战-课程表绘制

课程表
时间\日期
一
二
三
四
五
上午
9:30-10:15
语文
数学
外语
音乐
体育
10:25-11:10
数学
数学
物理
化学
生物
 
下午
14:30-15:15
体育
语文
历史
政治
化学
15:25-16:10
音乐
语文
数学
美术
语文

        效果：

 二、HTML表单

        网页中的表单由许多不同的表单元素组成，这些表单元素包括文字字段、单选按钮、复选框、按钮等。

2.1 插入表单对象

        1. 文字字段：

        该语法包含了许多参数，除了 type 参数以外，其他的参数都是可选的，大家可以自行选择。举个例子：

姓名：
年龄:

        2. 密码输入框： 

        密码输入框是一种特殊的文字字段，他的各个属性和文字字段是相同的，但是输入进密码输入框的字符全部是“*”表示，保证周围人看不见输入的文本。

        3. 单选按钮 ：  

男
女

        4. 复选框：

音乐
美术
数学

        5. 按钮 ：

        HTML 表单中，有三种按钮：提交按钮，重置按钮，匿名按钮。我们可以使用  元素或者  元素来创建一个按钮。type 属性的值指定显示什么类型的按钮。

提交按钮（submit）：用于发送表单数据给服务器。

This a submit button

重置按钮（reset）：

重置按钮用来清除用户在页面中输入的信息。

This a reset button

匿名按钮（button）：

没有自动生效的按钮，但是可以使用 JavaScript 代码进行定制。如果你省略了 type 属性，那么这就是默认值。

This a anonymous button
This a anonymous button

 

2.2 菜单和列表

        菜单和列表主要是用来选择给定答案中的一种，这类选择中往往答案比较多。

        1. 下拉菜单

        下拉菜单能够节省页面空间，正常状态下显示一个选项，单击展开所以选项。

成都广州四川上海

        2. 列表项

        在页面中列表项可以显示出几条信息，一旦超出这个信息量，在列表项右侧会出现滚动条，拖动滚动条可以看到所有选项。size="2" 表示一次显示 2 条数据。

成都广州四川上海

 2.3 文本域

        当用户想要填入多行文本时，就应该使用文本域而不是文本字段。文本域使用 </code> 标记。<code>cols</code> 代表列数，<code>rows</code> 代表行数。</p> <pre><code class="language-html"><form name="formBox" method="post" action="">留下您的联系方式：<textarea name="textarea" cols="35" rows="5">

 2.4 挑战-表单综合

姓名：
密码：
性别： 男 女
爱好： 唱歌 跑步 游泳
照片：
个人描述：
籍贯：成都广州四川上海

 三、总结

         表格与表单是网页的基础元素，本期主要是对其基础元素的简单使用做介绍，想要熟练使用还得在项目上练习呀。