教学之友,学习之友。

站长教学网

网站建设规划 10.网页中表格的运用

时间:2012-03-26 23:40来源:未知 作者:ken 点击:

  表格(table)是页面的重要元素,是页面排版的主要手段。尽管DHTML中的层(layer)也可以实现网页元素的自由定位,但是表格显然更加方便编辑与修改。熟练掌握和运用表格的各种属性,可以让您的页面看起来赏心悦目。

  本文将分两部分详细介绍表格在网页设计中的运用。包括表格的基本用法和表格运用的注意点。

  一.表格的基本用法。

  表格的基本用法相信您已经非常熟悉了。但为了保证文章的完整性,阿捷在这里还是再罗列一遍。

  ●表格的HTML基本语法

<table>...</table> - 定义表格
<tr> - 定义表行
<th> - 定义表头
<td> - 定义表元(表格的具体数据)

例如:

<table border> 
<tr><th>1</th>
    <th>2</th>
    <th>3</th> 
<tr><td>A</td>
    <td>B</td>
    <td>C</td> 
</table>

1 2 3
A B C

 

  ●table标签的参数。table标签可以含下列参数。

border            表格边框
cellspacing  表元之间的空白距离
cellpadding  表元内部的空白距离
width           表格宽度(可以用%或者具体数据表示)
height            表格高度

例如:

<table border=5 cellpadding=10>
<tr><th>1</th><th>2</th><th>3</th>
<tr><td>A</td><td>B</td><td>C</td> 
</table>

1 2 3
A B C

  ●表格的对齐方式

  1.表格内的文字对齐。

  语法:<td align=#> 其中#可以设定的参数有:

left    横向居左
center  横向居中
right   横向居右
top     纵向居顶
middle 纵向居中
bottom  纵向居底

例如:
<table border height=100>
<td valign=top>A</td>
<td valign=middle>B</td>
<td valign=bottom>C</td>
</table>

A B C

  2.表格在页面内的对齐。

  如果你需要与表格并排放一段文字,就需要用到table标签的另一个个参数:

  <table align=#> 其中#可以设定为left(居左),right(居右)

  例如:

<table align="left" border >
<tr><th>1</th><th>2</th><th>3</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
这里的文字<br>
是和表格并排排放的

  

1 2 3
A B C
这里的文字是和表格并排排放的

(责任编辑:ken)
TAG标签: 建站 设计 网页 制作 网站
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
注册登录:不允许匿名留言,登录后留言无需输入验证码。
栏目列表
最新内容