站内搜索:     
站点首页破釜学院网页制作Dreamweaver → 创建网页表格的基本原则和方法
正在加载相关信息.....
Web 站内搜索
创建网页表格的基本原则和方法
】【打印】【加入收藏】【关闭收藏到新浪ViVi】【收藏到365KEY】 浏览字号:
日期:2004-07-20 人气: 出处:天极


  2、表格的水平摆放位置

  表格的水平摆放位置是用align="#" 属性说明的,#为left(左对齐), right(右对齐), center(居中)。分别见下例,注意这三个表格与边界的位置关系:


左对齐
center
右对齐

第三个表格的代码如下:
<table width="80" border="1" align="right" height="30">
<tr>
<td>右对齐</td>
</tr>
</table>


  3、单元格里内容的位置属性

  水平对齐方式,用align="#"属性说明,#为left(左对齐), right(右对齐), center(居中);垂直对齐方式,用valign="#"属性说明,#为top(上对齐), bottom(下对齐), middle(居中)。分别见下例,注意单元格里的内容与边框的的位置关系:

水平对齐方式:

内容左对齐
内容居中
内容右对齐

代码如下:
<table width="450" border="1">
<tr>
<td width="150">
<div align="left">内容左对齐</div>
</td>
<td width="150">
<div align="center">内容居中</div>
</td>
<td>
<div align="right">内容右对齐</div>
</td>
</tr>
</table>


垂直对齐方式

内容上对齐
内容居中
内容下对齐

代码如下:
<table width="150" border="1">
<tr>
<td height="40" width="146" valign="top">内容上对齐</td>
</tr>
<tr>
<td height="40" width="146" valign="middle">内容居中</td>
</tr>
<tr>
<td height="40" width="146" valign="bottom">内容下对齐</td>
</tr>
</table>


  4、表格的背景色、背景图片,单元格的背景色、背景图片

  背景色属性:bgcolor="#" ,背景图片属性:background="#"。

见下例:

   
   
   

代码如下:
<table width="450" border="1" bgcolor="#539996" bordercolor="#FFFFFF" height="90">
<tr>
<td> </td>
<td background="Back01.gif"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td bgcolor="#FF0000"> </td>
<td> </td>
</tr>
</table>


  说明:在上例中,整个表格的背景色是 bgcolor="#539996" ,第一行第二列的单元格背景图片是 background="Back01.gif" ,第三行第二列的单元格背景色是 bgcolor="#FF0000" ,根据显示结果可以看出:设置表格的背景色后再设置单元格的背景色或背景图片,将优先显示单元格的属性。

  5、表格属性cellspacing、cellpadding

>>>> 进入论坛交流 <<<<