CSS中可以使用border-bottom
屬性為td元素添加下邊線,具體代碼可如下:
td { border-bottom: 1px solid black; }
上述代碼表示給所有td元素添加一條寬度為1像素、樣式為實線、顏色為黑色的下邊線。
如果想為某個特定的td元素添加下邊線,也可以給該元素添加一個class,并給該class定義下邊線樣式,例如:
<td class="with-bottom-border">Content</td> .with-bottom-border { border-bottom: 1px solid black; }
上述代碼表示為class為with-bottom-border的td元素添加一條寬度為1像素、樣式為實線、顏色為黑色的下邊線,而其他td元素則不受影響。
需要注意的是,如果td元素有padding或者border的話,下邊線的位置可能會有所偏差。此時可以使用box-sizing
屬性將元素的盒子模型設置為border-box,讓border和padding不會撐開元素。
td { border-bottom: 1px solid black; box-sizing: border-box; }
上述代碼表示給所有td元素添加一條寬度為1像素、樣式為實線、顏色為黑色的下邊線,并將元素的盒子模型設置為border-box。
上一篇css text文本居下
下一篇960css盒子模型代碼