更多本贴吧的教程以及精品帖子，请订阅邮件，所有教程都会通过邮件发送给大家：
《网编基础知识》
http://t.cn/zYXpKE7
==================
【网站编辑吧HTML教程】第十二节：图像
http://tieba.baidu.com/p/2260143513
【网站编辑吧HTML教程】第十一节：HTML 链接
http://tieba.baidu.com/p/2220953080
【网站编辑HTML教程】第十节：HTML 样式(CSS)
http://tieba.baidu.com/p/2196347696
【HTML学习每日一帖】第九节：HTML 编辑器
http://tieba.baidu.com/p/2189392328
【HTML学习每日一帖】第八节：HTML 文字格式 第2部分（共2部分）
http://tieba.baidu.com/p/2188419932
【HTML学习每日一帖】第七节：HTML 文字格式 第1部分（共2部分）
http://tieba.baidu.com/p/2186294161
【HTML学习每日一帖】第六节：HTML 段落
http://tieba.baidu.com/p/2172498555
【HTML学习每日一帖】第五节：HTML 标题
http://tieba.baidu.com/p/2170713998
【HTML学习每日一帖】第四节：HTML 属性
http://tieba.baidu.com/p/2166939406
【HTML学习每日一帖】第三节：HTML 元素
http://tieba.baidu.com/p/2150405207
【HTML学习每日一帖】第二节：HTML 常用标签
http://tieba.baidu.com/p/2137909263
【HTML学习每日一帖】第一节：HTML 简介
http://tieba.baidu.com/p/2136012179

表格在网页中使用非常广泛，几乎每个网页中，都能见到表格的存在。在是DIV没有流行之前，都是用表格来布局整个页面框架的，现在都还能看到不少的表格布局网站，但是由于没有DIV灵活，在布局上逐渐被替代。
标签 表格主要有三个标签：table、tr、td
Table是整个表格的开始，tr是一行，td才是单元格。一般情况下所有内容都写在td里面，否则不会显示。td又必须在一行之中，也就是tr标签中，tr必须被table标签包围。
例如：
<table>
<tr>
<td>网站编辑</td>
</tr>
</table>
　　这是一个完整的表格，没有定义边框的情况下，默认为零。没有修饰的边框，很丑，所以一般都不用边框。
图示：

边框属性
边框等于1像素的表格：
<table border="1">
<tr>
<td>网站编辑</td><td>网站编辑</td>
</tr>
<tr>
<td>网站编辑</td><td>网站编辑</td>
</tr>
</table>
图示：

表格布局：
Td标签里面，几乎可以放任何HTML内容标签，文字、图片、DIV……甚至td里面套用table用来实现某种布局，都是可以的。
实例：
<table border="1">
<tr>
<td>网站编辑</td><td>网站编辑</td><td>网站编辑</td><td>网站编辑</td>
</tr>
<tr>
<td>网站编辑</td><td>网站编辑</td><td>网站编辑</td><td>网站编辑</td>
</tr>
<tr>
<td colspan="4">
<table width="100%"border="1">
<tr>
<td>网站编辑</td><td>网站编辑</td><td>网站编辑</td>
</tr>
</table>
</td>
</tr>
</table>
图：

像上图这样，上面两行是4列，第三行为3列，如果不在td中套用table是很难实现的。

跨行以及列
有些时候，经常会用到跨行或者跨列，跨行是在tr标签中加入rowspan属性，跨列是在td标签中加入colspan属性。
实例：
<table border="1">
<tr>
<td>网站编辑</td><td>网站编辑</td><td>网站编辑</td><tdrowspan="2">这个跨行了</td>
</tr>
<tr>
<td>网站编辑</td><td>网站编辑</td><td>网站编辑</td>
</tr>
<tr>
<td colspan="4">
这个跨列了 </td>
</tr>
</table>
图示：

表格修饰：
为了表格的美观，我们经常为表格加上背景颜色，或者背景图片。背景颜色是bgcolor，学到这里应该都知道了，那么背景图片就是background。
实例：
<table border="1" background="http://tb.himg.baidu.com/sys/portrait/item/bf87666c5f38389508">
<tr>
<td>网站编辑</td><td>网站编辑</td><td>网站编辑</td><tdrowspan="2" bgcolor="#FFFF66">该单元格有背景颜色</td>
</tr>
<tr>
<td>网站编辑</td><td>网站编辑</td><td>网站编辑</td>
</tr>
<tr>
<td colspan="4">整个表格有网站编辑吧的logo做背景</td>
</tr>
</table>
图示：

边框的修饰：
边框的修饰，是稍微麻烦的，使用系统自带的简单边框，无论你几像素，无论什么颜色，都让人觉得粗糙。大家平时有空，可以多想想一些表格样式，自己去试验。
<style type="text/css">
<!--
.mytd{width:20%;
border-bottom:#62c9ea1px dotted;
padding:5px;
border-right:#62c9ea1px dotted;}
.mytable{border-top:#62c9ea 1px dotted;
border-left:#62c9ea 1pxdotted;}
</style>
<table width="400"bgcolor="#FFFFFF" class="mytable" align="center">
<tr>
<td class="mytd" bgcolor="#62c9ea" colspan="4"align="center">网站编辑吧表格教程</td>
</tr>
<tr align="center">
<td class="mytd"width="20%">网站编辑</td>
<td class="mytd"width="20%">网站编辑</td>
<td class="mytd"width="20%">网站编辑</td>
<td class="mytd"width="20%">网站编辑</td>
</tr>
<tr align="center">
<td class="mytd" width="20%">网站编辑</td>
<td class="mytd" width="20%">网站编辑</td>
<td class="mytd" width="20%">网站编辑</td>
<td class="mytd" width="20%">网站编辑</td>
</tr>
</tr>
<tr align="center">
<td class="mytd" width="20%">网站编辑</td>
<td class="mytd" width="20%">网站编辑</td>
<td class="mytd"width="20%">网站编辑</td>
<td class="mytd" width="20%">网站编辑</td>
</tr>
</table>
图示：

上面的代码解释一下：
<style type="text/css">
<!--
.mytd{width:20%;
border-bottom:#62c9ea1px dotted;
padding:5px;
border-right:#62c9ea1px dotted;}
.mytable{border-top:#62c9ea 1px dotted;
border-left:#62c9ea 1pxdotted;}
</style>
这是css代码段，在这里定义了两个样式mytd以及mytabl，在mytd中，我定义了右边框以及下边框。它的左边框以及上边框将共用左边的单元格以及上面的单元格的边框……说起来好像很复杂一样。
在mytable中，我定义了上边框以及左边框，大家可以自己去理解一下。

表格属性讲完，大家有没有搞明白的，可以提问，欢迎高手补充以及丰富该教程。
唐少说了，只要有人连续十天签到第一，即可获取神秘礼品……期待的赶紧行动哈。
我近期将推出一个网站，属于广大网编自己的网站，欢迎大家捧场，谢谢。

我要捧场 哈哈哈啊

看过了，老大写的真不错，支持并期待老大的网站早日上线

楼主很努力，不得不支持一下啊··

我今与子非一身
心齐何事欲祈年
已庆时来千亿寿
乱红飞尽不禁愁
求得鹤来教翦翅
勾芒若见应羞杀
搭在湘江作山色