HTML-表格的奇數偶數行顏色不同
阿新 • • 發佈：2019-01-29
/* *Copyright (c) 2017，煙臺大學計算機學院 All rights reserved. *檔名稱：關於HTML的練習 *作 者：張晴晴 *完成日期：201711月5日 *版 本 號：v1.0 * *問題描述：HTML5的新特性 *輸入描述： 無 *程式輸出： 無 */ <!doctype html> <html> <head> <meta charset="utf-8"> <title>10-25 work</title> <style> body{ background-color:#CCC; font-size:12px; font-family:"宋體"; } table{ margin:5px auto; width:60%; padding:5px; } th{ background-color:#76B7BC; font-size:14px; padding:5px; } .even td{/*必須加td，代表的是一行進行*/ background-color:#BCD7DA; padding:5px 6px; } .odd td{ background-color:#FFF;; padding:5px 6px;} </style> </head> <body> <table width="200" border="0"> <tr> <th>序號</td> <th>姓名</td> <th>班級</td> <th>性別</td> <th>電話</td> </tr> <tr class="odd"> <td>1</td> <td>qqz</td> <td>154</td> <td>女</td> <td>178555</td> </tr> <tr class="even"> <td>2</td> <td>qqz</td> <td>154</td> <td>女</td> <td>178555</td> </tr> <tr class="odd"> <td>3</td> <td>qqz</td> <td>154</td> <td>女</td> <td>178555</td> </tr> </table> </body> </html>
總結：奇數行偶數行設定不同上午class標識，不過在定義表示的時候一定要加上td，td代表一個單元格
執行結果：
