html基础学习第八节-表格的定义基础

说在前面

html的教程已经很久没有更新了，真的很抱歉，最近一直忙于网站和其他事情而忽略了这个我一开始就写的教程

现在，我已经不适用之前的整列模式，因为现在开始忙了，没时间弄那么好的规划，虽然那样可以增加可读性，可是可读性带来的却是我排版的繁琐，说简单也简单，不过那样我就需要整理好了再写教程，这样花费时间不说，而且容易遗忘要怎么继续写，好了，废话说道这里，我们现在开始来讲讲表格的定义

我们为什么要学习表格，我们学网页设计又不是弄个word？

对，没错，我又不懂办公office，甚至我都懒得学office，但是表格只是office的一部分，表格不是office特有的，表格是网站布局的一种形式，也可以说是通用的形式，怎么说呢？你看看网站的一个个模块，这就是一个表格，你可以看看php程序源码，里面几乎遍布了一堆div，为什么，因为表格的定义起了很大的布局作用，当然还有CSS！

表格有什么好学，直接在可视化模式下新建不就得了？

说这句话的人，你可以直接关闭这个站点，因为你是不想学习的人，对，科技是让人更简单的处理事务，但是，不是让你真的去偷懒什么都不学的，而且，表格在某些情况下是不能直接通过编辑器的可视化去布局，因为有很多情况，需要我们去想象，去拼接的，要做好布局，就必须学会表格的定义，前面有的定义，你甚至可以去html手册里查询，但是，表格这块，是重点，我前面的你甚至可以不用去学，因为重点在后面这里

好了，以后我也会利用这种对答的方式去写教程，我觉得这种方式写教程有助于别人理解这一课的重要性，当然不是哪一个不重要，都是重要的，只是重要在哪个地方，不重要的我肯定不写【PS：吐血，废话了太多】

表格如何定义？

表格主要由三个主要单词去定义，我说主要，是说还有其他单词组合进来参与定义的，一个是table，这个定义下面的内容是一个表格，好比center定义下面的内容是居中处理一个意思，然后是tr是定义一行，也就是一行的表格，td是定义一列，也就是一列的表格，border这里定义表格的边框线粗细定义为一个像素，不定义的话应该看不见吧，我也没试过，大家试试看下面来看一组简单的表格代码

<table border="1">

<tr>

<td>A1</td><td>A2</td><td>A3</td>

</tr>

<tr>

<td>B1</td><td>B2</td><td>B3</td>

</tr>

</table>

结果显示如下的一个表格

A1	A2	A3
B1	B2	B3

这就是一个简单的表格，大家可以看到，html在这里继续继承他的崁套模式，也就是先定义一个大体的表格，然后表格里面定义一个大体的一行，一行里面又定义一列一列，这样的形式去定义一个表格，大家看懂了吗？如果不懂，反复的去看那段代码就是了，然后我们下面来说说高级一点的定义

先来用colspan来做左右两个表格合并，在word下是很简单的，html这里也很简单，只要一个定义就可以，看看代码

<table border="1">

<tr>

<td>A1</td><td colspan="2">A2A3</td>

</tr>

<tr>

<td>B1</td><td>B2</td><td>B3</td>

</tr>

</table>

结果如下【看上面红色部分的差异】

A1	A2A3
B1	B2	B3

这里大家可以看到代码这里，colspan等于2就定义了横向两个合并为一个单元格，也就是格子，只需要在td这里空一行然后加上等于几就可以定义几个格子合并

然后我们来看看下面的那个竖向的合并怎么定义，其实也很简单，用一个rowspan就可以定义到，看如下代码