CSS設置td邊框
在HTML表格中,我們可以用td元素來表示表格單元格中的內容。CSS中可以通過設置td元素的邊框樣式來美化表格的顯示效果。
CSS樣式中有個屬性border用于設置邊框樣式,它有以下幾個常用的取值:
- none:無邊框;
- solid:實線;
- dotted:點狀線;
- dashed:虛線。
我們可以給一個單獨的td元素添加樣式,代碼如下:
``````
上述代碼表示將所有的td元素邊框設置為1像素實線,顏色為灰色。
我們也可以指定某一列的所有單元格的邊框樣式,代碼如下:
``````
上述代碼表示將表格中第二列的所有單元格邊框設置為1像素點狀線,顏色為藍色。
還可以使用CSS偽類`:hover`實現鼠標懸浮時的邊框樣式,代碼如下:
``````
上述代碼表示鼠標懸浮在td元素上時,將其邊框設置為2像素實線,顏色為紅色。
需要注意的是,表格邊框的顯示效果也受到表格的邊框合并設置影響。如果表格的border-collapse屬性值為collapse,表示表格單元格的邊框將合并顯示成一條邊框,如果值為separate,表示邊框將獨立顯示。
總的來說,CSS設置td邊框可以讓表格更美觀,并且通過選擇器的靈活設置,可以實現不同效果的表格樣式。
上一篇css 設置div為方塊
下一篇css3讓圖片移動