精美标签之表格标签

表格标签：

代码：

<table border="1" cellSpacing="1" cellPadding="3" width="650"

bgColor="#00f200" height="210">

<tbody>

<tr>

<td>

</td></tr></tbody></table>

这是最基础的一套表格标签。下面的代码中都是只提供了表格标签，表格的其它标签，可从这里复制使用。

效果

代码1：

<table border="5" cellSpacing="10" borderColor="#990000"

cellPadding="1"  width="620"

background=http://image52.360doc.com/DownloadImg/2012/06/0415/24605894_3.jpg

bgColor="#00ff00" height="300">

上面的代码设置了边框线宽度、间距、边框线颜色、边距、表格宽度、背景图片、背景颜色和表格高度。(如果不想用背景图片，可以把背景图片地址“删除”，输入文字“背景图片”。)

效果

代码2：<table style="border-width: 2px; border-style: solid; border-color: rgb(128, 128, 128)

rgb(0, 0, 0) rgb(0, 0, 0) rgb(128, 128, 128); width: 205px;

height: 43px;" title=""  cellSpacing="9"

background=http://userimage2.360doc.com/10/1117/15/2904667_20101117150520752.jpg

align="center">

上面的代码设置了边框线宽度、边框线样式、四条边框线的颜色、表格宽度、表格高度、表格标题、间距、背景图片和对齐方式。

效果

代码３：<table border="1" cellSpacing="2" borderColorLight="#a2875a"

borderColorDark="#000000" cellPadding="0" width="570">

上面的代码设置了边框线宽度、间距、亮边框颜色borderColorLight（指左、上边框和单元格右、下边框颜色）、暗边框颜色（指右、下边框和单元格左、上边框颜色）、边距和表格宽度。（light 是明亮的意思，dark 是暗调的意思。）

代码４：

<table border="5" cellSpacing="10" borderColor="#990000"

cellPadding="0" width="620"

background=http://image52.360doc.com/DownloadImg/2012/06/0415/24605894_3.jpg bgColor="#00ff00"frame="above" height="300">

这是只显示上边框的表格代码，可修改为只显示其它边框的表格代码。（表格的frame 属性控制着表格最外围的四条边框的可见性。frame=above 为只显示顶部边框；frame=below为只显示底部边框；frame=lhs为只显示左侧边框；frame=rhs为只显示右侧边框 ；frame=hsides为只显示水平方向的两条边框 ；frame=vsides为只显示垂直方向的两条边框 ； frame= void 为默认值，表示不显示表格最外围的边框；frame=box和frame=border都为同时显示四条边框。）

代码５：

<table style="filter: Alpha(opacity=100,style=2);" border="0" cellSpacing="10"

cellPadding="0" width="780" background="图片地址" align="center" height="780">

上面的代码设置了Alpha滤镜样式。表格中设置的背景图片、单元格中放入的图片、输入的文字都会有渐变效果（文字的效果不大好）。

代码6：

<table style="filter: shadow(color:#ADFF2F ,direction:120,strength:30);"

border="1" cellSpacing="35" borderColor="#ee0000" cellPadding="0" align="center">

上面的代码设置了滤镜的投影效果、边框线宽度、边框线颜色、间距、边距和对齐方式。表格中设置的背景图片、单元格中放入的的图片、输入的文字都会有投影效果。

代码７：

<table style="border-color: rgb(0, 200, 0); left: 0px; top: 3px; width: 416px;

height:550px; position: relative;" id="table1" border="5">

上　　面的代码设置了边框颜色、边框线宽度、表格的宽度、表格的高度、相对定位代码、表格的身份。

表格标签中设置了相对定位代码，表格中放入的内容可设置绝对定位代码，给这些内容定位。