繁体中文
设为首页
加入收藏
当前位置:网站制作首页 >> HTML教程 >> HTML 表格

HTML 表格

2007-07-15 08:00:00  作者:  来源:互联网  浏览次数:0  文字大小:【】【】【
简介:With HTML you can create tables. 通过HTML你可以建立表格。 Examples 例子 Tables 表格 This example demonstrates how to create tables in an HTML document. 这个例子演示了怎么在一个HTML文档中建立表格。...
关键字:表格 HTML

With HTML you can create tables.

通过HTML你可以建立表格。

Examples

例子

Tables

表格

This example demonstrates how to create tables in an HTML document.

这个例子演示了怎么在一个HTML文档中建立表格。

Table borders

表格边框

This example demonstrates different table borders.

演示不同的表格边框。

(You can find more examples at the bottom of this page)

下面会有更多的例子。

Tables

表格

Tables are defined with the

tag. A table is divided into rows (with the tag), and each row is divided into data cells (with the tag). The letters td stands for "table data," which is the content of a data cell. A data cell can contain text, images, lists, paragraphs, forms, horizontal rules, tables, etc.

标签用来定义表格。一个表格被划分为若干行(使用标签) 然后每个行可以被分成若干数据格(使用标签)。td的意思就是"Table data"里面可以带数据,数据类型可以是文字、图象、列表、段落、表单、水平分割线、表格、等。

row 1, cell 1

row 1, cell 2

row 2, cell 1

row 2, cell 2

How it looks in a browser:

在浏览器中的效果就是:

row 1, cell 1

row 1, cell 2

row 2, cell 1

row 2, cell 2

Tables and the Border Attribute

表格和其边框属性

If you do not specify a border attribute the table will be displayed without any borders. Sometimes this can be useful, but most of the time, you want the borders to show.

如果你不加以说明那表格的边框属性为不显示。有时候这是蛮有用的,但大多数时候你还是需要显示边框的。

To display a table with borders, you will have to use the border attribute:

如果你想要显示表格边框的话,就必须使用边框属性:

Row 1, cell 1

Row 1, cell 2

Headings in a Table

表格中的标题

Headings in a table are defined with the tag.

一个表格中的标题是由 标签定义的。

Heading

Another Heading

row 1, cell 1

row 1, cell 2

row 2, cell 1

row 2, cell 2

How it looks in a browser:

显示的效果为:

Heading

Another Heading

row 1, cell 1

row 1, cell 2

row 2, cell 1

row 2, cell 2

Empty Cells in a Table

表格的空单元格

Table cells with no content are not displayed very well in most browsers.

大多数浏览器可以显示单元格不包含任何东西。

row 1, cell 1

row 1, cell 2

row 2, cell 1

How it looks in a browser:

显示效果:

row 1, cell 1

row 1, cell 2

row 2, cell 1

Note that the borders around the empty table cell are missing (NB! Mozilla Firefox displays the border).

注意包围空单元格的边框消失了(Mozilla Firefox浏览器则会显示)

To avoid this, add a non-breaking space ( ) to empty data cells, to make the borders visible:

为了避免这个的话就得添加一个空格符号来让这个边框显示出来:

row 1, cell 1

row 1, cell 2

row 2, cell 1

How it looks in a browser:

显示的效果:

row 1, cell 1

row 1, cell 2

row 2, cell 1

Basic Notes - Useful Tips

实用提示

The , and elements are seldom used, because of bad browser support. Expect this to change in future versions of XHTML. If you have Internet Explorer 5.0 or newer, you can view a working example in our XML tutorial.

, and 这些元素很少用到,因为它们不能很好的被浏览器支持,除非将来的XHTML版本改变这一现状。如果你的浏览器是IE5。0以上的你可以看看在我们的XML教程里一个效果的例子 。

More Examples

更多例子

Table with no border

没边框的表格

This example demonstrates a table with no borders.

这个案例展示了无边框的表格。

Headings in a table

表格中的标题

This example demonstrates how to display table headers.

这个案例展示了如何显示表格的标题。

Empty cells

空单元格

This example demonstrates how to use " " to handle cells that have no content.

这个案例展示了如何使用“ ”来处理无内容的单元格。

Table with a caption

表格起头

This example demonstrates a table with a caption.

这个案例展示了包含标题的表格。

Table cells that span more than one row/column

表格中单元格的多行或多列

This example demonstrates how to define table cells that span more than one row or one column.

这个案例展示了如和对跨行、跨列的单元格进行定义。

Tags inside a table

表格中使用标签

This example demonstrates how to display elements inside other elements.

这个案例展示了如何显示元素内的元素。

Cell padding

表格的内补丁

This example demonstrates how to use cellpadding to create more white space between the cell content and its borders.

这个案例展示了如何使用cellpadding在内容和表格之间设定更多留白。

Cell spacing

单元格之间的空隙

This example demonstrates how to use cellspacing to increase the distance between the cells.

这个案例展示了如何使用cellspacing增加单元格之间的距离。

Add a background color or a background image to a table

给整个表格添加背景颜色或者是图象

This example demonstrates how to add a background to a table.

这个案例展示了如何给表哥添加一个background[背景]属性。

Add a background color or a background image to a table cell

给单元格添加背景颜色或者是图象

This example demonstrates how to add a background to one or more table cells.

这个案例展示了如何给多个单元格添加background[背景]属性。

Align the content in a table cell

单元格的文字对齐

This example demonstrates how to use the "align" attribute to align the content of cells, to create a "nice-looking" table.

这个案例展示了如何使用“align[排列]”属性对单元格的内容进行排列。

The frame attribute

框架属性

This example demonstrates how to use the "frame" attribute to control the borders around the table.

这个案例展示了如何使用“frame”属性控制边框。

Table Tags

表格标签一览

Tag

标签

Description

描述

Defines a table

定义一表格

Defines a table header

定义表格头

Defines a table row

Defines a table cell

表格单元

Defines a table caption

表格说明

Defines groups of table columns

表格队列

Defines the attribute values for one or more columns in a table

为一表格中的一个或多个列定义属性值

Defines a table head

表格头部

Defines a table body

表格主体

Defines a table footer

表格底部

责任编辑:admin
相关文章