热门文章 | 热门软件| 热门源码 | 热门电影 | 知识库 | 联系我们
软件 源码 教程 影视 健康 招聘
  HTML | JavaScript | ASP | PHP | JSP | NET | VB | VC | VF | Windows | Linux | Mysql | Mssql | Oracle | Struts 
当前位置: 创世纪计算机资源网 -> 文章频道 ->html 
站内搜索:
活用表格美化网页(2)
作者:星河 来源:yesky 整理日期:2007-3-18

  2、利用“cellspacing”属性制作细线表格

  有时候们需要用表格边框来区分各部分内容,若将表格边框宽度设置为“1”,又显得过于突出,影响整个页面的美观,怎么办呢?们来看看下面两个表格以及它们的代码(注意红色部分代码):

 
表格A
表格B


表格A代码:
<table width="160" border="1" cellspacing="0" height="40">
<tr>
<td>
<div align="center">表格A</div>
</td>
</tr>
</table>


表格B代码:
<table width="160" cellspacing="1" border="0" bgcolor="#000000" height="40">
<tr>
<td bgcolor="#FFFFFF"
<div align="center">表格B</div>
</td>
</tr>
</table>

  表格A直接设置边框宽度为1,显示的结果并不令人满意,表格B则利用了“cellspacing”属性,边框明显细多了,显的更加精致。

  在DreamWeaver中的快速通道 

  在Dreamweaver中插入一个一行一列的表格,表格的属性面板设置如下:

  

  选择单元格,把单元格的背景色设置为白色就ok了!

  说明:前面已经知道,cellspacing属性用来指定表格各单元格之间的空隙。们设置整个表格的背景色时也包含了这个空隙,而设置单元格的背景色时却不包含这个空隙,所以,浏览器中显示的表格“边框线”并不是真正意义上的表格边框,而是单元格与单元格的空隙(此处的空隙们设置的是“1pix”)。

  练习:试制作出如下的效果(提示:原理同上,不同的是需要将每个单元格的背景都设置为白色。)

 
       
       
       
       


  3、利用“cellpadding”属性制作等间距细线表格
[1]  [2]  [3]  [4]  [5]  [6]  
相关文章