CSS中的表格是網(wǎng)頁設(shè)計中非常常見的元素,表格的數(shù)據(jù)可以清晰地展示出來,表格的TH(Table Header)標(biāo)簽是表頭單元格的縮寫,主要用來定義表格的表頭。下面,給大家分享一下如何使用CSS來設(shè)置表格中的TH。
/*設(shè)置TH的樣式*/ th { background-color: #f2f2f2; color: #000; text-align: left; padding: 10px; font-weight: bold; }
上面的CSS樣式中,我們設(shè)置了TH的背景顏色、文字顏色、文本對齊方式、內(nèi)邊距和字體加粗等樣式。其中,padding屬性可以控制單元格中文字與單元格邊框之間的距離。在樣式中設(shè)置TH的樣式,能夠讓表格更加美觀。
除了設(shè)置TH樣式之外,我們還可以設(shè)置表格的邊框樣式和單元格之間的邊距,代碼如下:
/*設(shè)置表格邊框*/ table { border-collapse: collapse; } /*設(shè)置表格單元格之間的邊距*/ td, th { border: 1px solid #dddddd; text-align: left; padding: 8px; } /*設(shè)置表格的外邊距*/ table { margin: 20px; }
上面的代碼中,我們使用了border-collapse屬性設(shè)置了表格的邊框合并,可以讓整個表格看起來更加整潔美觀。同時,我們使用了border、text-align和padding屬性分別設(shè)置了單元格的邊框樣式、文本對齊方式和內(nèi)邊距。此外,我們還可以使用margin屬性設(shè)置表格的外邊距。
通過上述的CSS代碼設(shè)置,我們能夠給表格中的TH添加樣式,以及設(shè)置表格的邊框樣式、單元格之間的邊距和表格的外邊距,從而讓表格更加美觀實用。
上一篇css中自動提示信息
下一篇css中線型為雙線