使用Javascript製作行間顏色間隔

來源:互聯網
上載者:User
製作頁面,有時為了擺脫表格行與行之間單調顏色的顯示,追求一種簡單視覺效果,要求每行之間以不同顏色顯示。一般製作時,都以手工隔行調節色系,這樣就會出現管理表格極為不方便。解決的方法就是使用Javascript與CSS來控制。

  製作方法:

  1、在<head></head>間插入CSS樣式,代碼:

.t1 {background-color:#336699}
.t2 {background-color:#ffcc00}

  其中,#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>

  製作完成,請自己製作一個看看效果吧!!

 

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.