制作頁面,有時為了擺脫表格行與行之間單調顏色的顯示,追求一種簡單視覺效果,要求每行之間以不同顏色顯示。一般制作時,都以手工隔行調節色系,這樣就會出現管理表格極為不方便。解決的方法就是使用Javascript與CSS來控制。
制作方法:
1、在<head></head>間插入CSS樣式,代碼:
.t1 {background-color:#336699}
.t2 {background-color:#ffclearcase/" target="_blank" >cc00}
其中,#336699與#ffcc00為每行間的顏色值。
2、使用Dreamweaver插入表格。并給表格賦予ID值:<table id="table1">
3、在表格<table>...</table>代碼下,插入Javascript代碼:
<script Language="Javascript1.2">
for (i=0;i<table1.rows.length;i++) {
(i%2==0)?(table1.rows(i).className = "t1"):(table1.rows(i).className = "t2");
}
</script>
制作完成,請自己制作一個看看效果吧!!