上一页 下一页

网页如何工作

创建表格

目前,最广泛使用的用于巧妙排布网页的HTML工具之一是表格。通过掌握表格,您不再只是“创建”一个页面,而是“设计”一个页面。

您可以使用的表格种类繁多,从简单的方框到非常复杂的设计布局。在本文中,我们将讨论表格基础知识,以及一些您可以尝试的技巧和提示,以设计出人们喜爱访问的精彩页面。

广告

同样,与所有您希望在浏览器窗口中显示的信息一样,请确保您的表格位于HTML文档的<body>和</body>标签之间。使用以下标签开始您的表格:

<table>

表格中的每个水平以以下标签开始:

<tr>

而且,行内的每个数据项都以以下标签开始:

<td>

考虑以下表格图:

A1  A2

B1  B2

C1 C2

这里有三行两列。

要编写此图的骨架代码,请按以下顺序使用以下标签:

<table>    开始表格

<tr>       开始第一行

<td>      开始第一个数据“单元格”(A1)

</td>    关闭A1单元格

<td>      开始第二个单元格(A2)

</td>    关闭A2单元格

</tr>     关闭第一行

<tr>       开始第二行

<td>      开始第二行中的第一个数据单元格(B1)

</td>    关闭B1单元格

<td>      开始B2单元格

</td>    关闭B2单元格

</tr>     关闭第二行

<tr>       开始第三行

<td>      开始第三行中的第一个数据单元格(C1)

</td>    关闭C1单元格

<td>      开始C2单元格

</td>    关闭C2单元格

</tr>     关闭第三行

</table>  关闭表格

许多设计师喜欢对表格的部分内容进行缩进,以使代码更易于阅读。示例如下。

现在我们将在表格骨架中添加数据和边框边框是表格的轮廓。边框标签 (border="value") 放置在初始表格标签内。您可以通过分配特定值来指定边框的厚度(我们将分配值为“1”)。建议您尝试不同的值,看看它们在浏览器中显示的效果。如果您不希望显示边框,请分配“0”值。

(注意:即使您不打算让表格显示边框,最好还是先使用可见边框,至少在解决可能影响表格显示方式的任何“错误”之前。)

将以下代码和数据键入(或剪切并粘贴)到您的HTML文档中

<table border=1>   
<tr><td>A1    </td>    
<td>A2</td>   </tr>   
<tr><td>B1    </td>    
<td>B2</td>   </tr>   
<tr><td>C1    </td>    
<td>C2</td>   </tr>  
</table>  

在您的浏览器中显示的表格应该与前面所示的图表非常相似。

您可以为表格分配许多属性。接下来将讨论允许您以多种创意方式格式化表格的标签。

在下一节中,我们将了解如何更改表格的背景颜色。