在網頁開發中,表格是一個經常用到的元素。在默認狀態下,表格可能會顯得比較單調,這時我們可以使用CSS來進行調整,讓表格更美觀、易讀。
以下是一些常見的表格調整方法:
/* 設置表格邊框 */ table { border-collapse: collapse; /* 合并邊框 */ border: 1px solid #ccc; /* 設置邊框樣式 */ } /* 設置表頭樣式 */ thead tr { background-color: #eee; /* 設置背景色 */ font-weight: bold; /* 設置字體加粗 */ } /* 設置交替行背景色 */ tbody tr:nth-child(odd) { background-color: #f9f9f9; } /* 設置表格單元格間距 */ td, th { padding: 10px; /* 設置內邊距 */ } /* 設置表格寬度 */ table { width: 100%; /* 充滿父容器 */ } /* 設置表頭固定 */ thead { position: sticky; top: 0; z-index: 1; }
這些調整可以根據實際需求進行組合和修改,讓表格達到最佳效果。
上一篇用css確定控件位置
下一篇css調整表格內容