CSS表格帶橫線且輸入文字可以實現更美觀的數據展示和更清晰的信息傳達。下面是一個簡單的代碼示例:
table { border-collapse: collapse; width: 100%; } th, td { text-align: left; padding: 8px; } th { background-color: #f2f2f2; border-bottom: 2px solid black; } td { border-bottom: 1px solid #ddd; }
其中,border-collapse: collapse
可以將單元格邊框合并為一個,讓表格看起來更整齊。而border-bottom
則可以實現表頭帶有粗橫線,而其他行帶有細橫線的效果。
在HTML中,我們可以使用table
標簽來創建表格,如下:
姓名 | 性別 | 年齡 |
---|---|---|
張三 | 男 | 28 |
李四 | 女 | 32 |
通過結合CSS樣式,我們可以實現下圖所示的效果:
姓名 | 性別 | 年齡 |
---|---|---|
張三 | 男 | 28 |
李四 | 女 | 32 |
上一篇css顏色設置透明
下一篇css顏色透明色 代碼