简单实用的表格特效

《简单实用的表格特效》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、在我们制作主页的过程中，用到表格的地方非常多，灵活运用表格技巧可以为我们的网页增色不少，这里我就详细介绍几中特效表格的制作方法。　　一、彩色虚线表格虚线表格＜styletype="text/css"＞＜!--.tab1{border-top-width:thin;border-right-width:thin;border-bottom-width:thin;border-left-width:thin;border-top-style:dotted;border-right-style:dotted;border-bottom-style:dotted;bor

2、der-left-style:dotted;border-top-color:#00CC66;border-right-color:#0099CC;border-bottom-color:#FF0000;border-left-color:#6699FF;}--＞＜/style＞＜tablewidth="200"border="0"cellpadding="2"cellspacing="2"class="tab1"＞＜tr＞＜td＞＜divalign="center"＞虚＜/div＞＜/td＞＜td＞＜divalign="center"＞线＜/div＞＜/td＞

3、＜/tr＞＜tr＞＜td＞＜divalign="center"＞表＜/div＞＜/td＞＜td＞＜divalign="center"＞格＜/div＞＜/td＞＜/tr＞＜/table＞　　二、鼠标指向单元格变色   onmouseout="this.style.backgroundColor=''"鼠标离开效果onmouseover="this.style.backgroundColor='#FFcccc'"鼠标放上去的效果，可以修改#FFcccc的值来改变颜色＜tablewidth="200"border="1"cellspacing="0"cellpaddi

4、ng="0"＞＜tr＞＜tdonmouseout="this.style.backgroundColor=''"onmouseover="this.style.backgroundColor='#FFcccc'"＞ ＜/td＞＜/tr＞＜tr＞＜tdonmouseout="this.style.backgroundColor=''"onmouseover="this.style.backgroundColor='#FFccaa'"＞ ＜/td＞＜/tr＞＜/table＞ 　　三、立体表格 立体表格＜tableborder="1"bordercolorlight=

5、"#ffffff"bordercolordark="#ffffff"width="200"cellpadding="0"cellspacing="0"＞＜tralign="center"＞＜tdwidth="86"bordercolorlight="#000000"bordercolordark="#eeeeee"bgcolor="#B7B7B7"＞立体＜/td＞＜tdwidth="108"bordercolorlight="#000000"bordercolordark="#eeeeee"bgcolor="#B7B7B7"＞表格＜/td＞＜/tr＞＜/tabl

6、e＞　　四、表格嵌套　　1、利用表格的间距来做嵌套＜tablewidth="200"border="1"cellspacing="4"cellpadding="0"＞＜tr＞＜td＞ ＜/td＞＜td＞ ＜/td＞＜td＞ ＜/td＞＜/tr＞＜/table＞主要是用到间距cellspacing="4"   　　2、充分利用根据表格对齐的方式　　这里主要是将第一个表格居左，第二个表格居右，第三个表格居中。这样当你随意调整里面三个表格大小的时候，他们的间距将保持不变，非常方便。   ＜tablewidth="200"border="1"cellpadding="0

7、"cellspacing="0"bordercolor="#FF0000"＞＜tr＞＜td＞＜tablewidth="60"border="1"align="left"cellpadding="0"cellspacing="0"＞＜tr＞＜td＞ ＜/td＞＜/tr＞＜/table＞＜tablewidth="60"border="1"align="right"cellpadding="0"cellspacing="0"＞＜tr＞＜td＞ ＜/td＞＜/tr＞＜/table＞＜tablewidth="80"border="1"align="center"cellp

8、adding="0"ce