推薦一篇利用th,colgroup,col定義表格樣式_經驗交流

定義表格各列的樣式，不用每個td都在那裡加一堆的Class，利用th,colgroup,col等屬性，輕鬆搞定^_^
程式碼如下：

複製程式碼 a> 程式碼如下:

  
    
    
    
  
  
    
        
  
  
    
    
 >邊框折疊：折疊；
顏色：#454545；
字體：11px/150% Verdana、Arial、Helvetica、sans-serif；
  

    
    
     
  
  
    
 
    
    
  
  
  td> col
    
    
    
    
    
    
    
    
    
    
  表>

拋磚引玉，更多效果就由你DIY了！

表.演示 { 邊界崩潰：崩潰； 顏色：#454545； 字體：11px/150% Verdana、Arial、Helvetica、sans-serif； } 表.演示 th { 內邊距：3px 7px； 邊框：1px實心#f60； 邊框寬度：2px 1px 1px； 背景：#ffffe1； } 表.演示 td { 內邊距：3px 7px； 邊框：1px實心#f60； } 表.示範 col.Col1 { 文字對齊：右對齊； 背景：#f5f5f5； } 表.示範 col.Col2 { 顏色：#00c； } 表.示範 col.Col3 { 字體樣式：斜體； } 風格> <tr> <th>標籤名稱</th> <th>類別名稱</th> <th>CSS</th> </tr> <colgroup> <col> <col> <col> </colgroup> <tr> <td>表格</td> <td>演示</td> <td>邊框折疊：折疊； 顏色：#454545； 字體：11px/150% Verdana、Arial、Helvetica、sans-serif；</td> </tr> <tr> <td>第</td> <td></td> <td>內邊距：3px 7px； 邊框：1px實心#f60； 邊框寬度：2px 1px 1px； 背景：#ffffe1;</td> </tr> <tr> <td>td</td> <td></td> <td>內邊距：3px 7px； 邊框：1px 實心 #f60;</td> </tr> <tr> <td>列</td> <td>第 1 列</td> <td>文字對齊：右； 背景：#f5f5f5；</td> </tr> <tr> <td>列</td> <td>第 2 列</td> <td>顏色：#00c；</td> </tr> <tr> <td>列</td> <td>第3欄</td> <td>字體樣式：斜體；</td> </tr>表>
[​​Ctrl A 全選注:如需引入外部Js需刷新才能執行]

TagName	ClassName	CSS
表格	示範
第		內邊距：3px 7px; 邊框：1px# solid . >邊框寬度: 2px 1px 1px; 背景: #ffffe1;
td
td	內邊距：3px 7px; 邊框：1px solid #f60;
Col1	配位：右； 背景：#f5f5f5;
col	Col2	顏色：#00c;
col	Col3	字體樣式：斜體；