CSS表格怎么寫代碼?
CSS表格是一種使用CSS樣式來美化和增強(qiáng)HTML表格的方法,通過CSS,您可以輕松地控制表格的外觀,如顏色、字體、大小等,以及添加一些特殊效果,如陰影、圓角等。
下面是一些CSS表格的代碼示例:
1、基本CSS表格代碼:
<table> <thead> <tr> <th>姓名</th> <th>年齡</th> <th>性別</th> </tr> </thead> <tbody> <tr> <td>張三</td> <td>20</td> <td>男</td> </tr> <tr> <td>李四</td> <td>25</td> <td>女</td> </tr> </tbody> </table>
2、美化CSS表格代碼:
<table style="width:100%; border-collapse:collapse;"> <thead style="background-color:#f0f0f0;"> <tr> <th style="padding:10px; border:1px solid #000;">姓名</th> <th style="padding:10px; border:1px solid #000;">年齡</th> <th style="padding:10px; border:1px solid #000;">性別</th> </tr> </thead> <tbody style="background-color:#fff;"> <tr style="border-bottom:1px solid #000;"> <td style="padding:10px; border:1px solid #000;">張三</td> <td style="padding:10px; border:1px solid #000;">20</td> <td style="padding:10px; border:1px solid #000;">男</td> </tr> <tr style="border-bottom:1px solid #000;"> <td style="padding:10px; border:1px solid #000;">李四</td> <td style="padding:10px; border:1px solid #000;">25</td> <td style="padding:10px; border:1px solid #000;">女</td> </tr> </tbody> </table>
在上面的代碼中,我們使用了CSS樣式來美化表格,如設(shè)置表格寬度、邊框、背景顏色等,我們還為表格中的每個單元格添加了樣式,如設(shè)置單元格的邊框、背景顏色等,以使表格更加美觀。
版權(quán)聲明:除非特別標(biāo)注,否則均為本站原創(chuàng)文章,轉(zhuǎn)載時請以鏈接形式注明文章出處。