一、设计图形按钮链接 使用css的background-image属性实现。 代码如下：
<style type="text/css"> a.reg{ background: transparent url('ps做好的背景图') no-repeat top left; display: block; width: 74px; height: 25px ; text-indent: -999px; } </style> <body> <a class="reg" href="#">注册</a> </body>显示效果如下：
注册二、美化表格 CSS为表格定义5个属性：border-collapse、border-spacing、caption-side、caption-cells、table-layout。
定义边框样式：
代码如下：
<style type="text/css"> table{/*合并单元格边框*/ width:100%; empty-cells: show; } caption{ caption-side: bottom; /*底部显示*/ font-size: 24px; /*定义字体大小*/ margin: 12px; /*定义左右边界*/ color: blue; /*定义字体颜色*/ font-weight: bold; /*加粗显示*/ } td，th{border:solid 1px #ff0000;} /*定义单元格边框为1像素的细线*/ tfoot{text-align: left;} </style> <body> <table border='2'> <caption>结构化表格标签</caption> <thead> <tr> <th>标签</th><th>说明</th> </tr> </thead> <tfoot> <tr> <td colspan="2">在表格中，上述标签为可选标签</td> </tr> </tfoot> <tbody> <tr> <td>⁢tbody></td><td>定义表格主题结构</td></tr> <tr><td>⁢tfoot></td><td>定义表格的页脚结构</td></tr> <tr><td>⁢thead></td><td>定义表格的表头结构</td> </tr> </tbody> </table> </body>效果图如下：
三、定义单元格间 在table中加border-spacing：20px.起到分隔单元格边框。
效果图如下：
四、定义标题位置 定义标题显示位置包括top位于表格上面、bottom位于表格底部
caption{ caption-side: top; /*头部显示*/ font-size: 24px; /*定义字体大小*/ margin: 12px; /*定义左右边界*/ color: blue; /*定义字体颜色*/ font-weight: bold; /*加粗显示*/ }效果图显示如下： 五、隐藏空单元格 使用CSS的empty-cells属性可以设置空单元格是否显示。 属性值包括show、hide
