HTML表格:修订间差异

来自站长百科
跳转至: 导航、​ 搜索
无编辑摘要
(没有差异)

2008年12月16日 (二) 13:13的版本

HTML表格用< table >表示。一个表格可以分成很多行(row),用< tr >表示;每行又可以分成很多单元格(cell),用< td >表示。

'代码示例:'

带边框的表格:

<table border>

<tr><th>Food</th><th>Drink</th><th>Sweet</th>

<tr><td>A</td><td>B</td><td>C</td>

<nowki></nowiki>

FoodDrinkSweet
ABC

'跨多行、多列的表元'

跨多列的表元

'代码示例:'

<table border>

<tr><th>Food</th><th>Drink</th><th>Sweet</th>

<tr><td>A</td><td>B</td><td>C</td>

<nowki></nowiki>

Morning Menu
Food Drink Sweet
ABC







这三个Tag是创建表格最常用的Tag。

示例


border属性
在缺省情况下,如果不设置表格的边界,表格是不显示边界的。

示例:不显示表格边界

要显示表格的边界,可使用border这个属性。

示例:显示表格边界

表格的表头

用来表示表格的表头,表头的字是粗体显示的。

示例:有表头的表格

空的单元格

如果表格的单元格之间没有内容,那么这个单元格的边界是不会被显示出来的,尽管整个表格已设置边界值。要显示这个单元格的边界,可以插入一个 空格符。

示例2

更多示例
有标题的表格

这个示例演示如何用在一个表格上加上标题。
包含多列或多行的单元格
这个示例演示如何用colspan,rowspan设置多列或者多行的单元格。
单元格里的内容
这个例子演示单元格里面的内容。单元格的内容可以是文字,图片,超链接,Form,表格等。

单元格与单元格边界间距离

这个示例教你如何用cellpadding这个属性设置单元格内容与单元格边界之间的距离。
单元格之间的距离

这个示例教你如何用cellspacing这个属性设置单元格之间的距离

表格背景颜色和图片

这个示例演示如何用bgcolor属性设置表格的背景颜色,如何用background属性为表格添加背景图片。

单元格背景颜色和图片

这个示例演示如何用bgcolor属性设置单元格的背景颜色,如何用background属性为单元格添加背景图片。

单元格内容的对齐方式

这个示例教你如何用align属性设置单元格的对齐方式。