CSS表格里的行可以通過設(shè)置邊框樣式來實現(xiàn)虛線效果??梢允褂谩癰order-style”屬性來設(shè)置邊框樣式,屬性值為“dashed”,表示邊框為虛線,例如:
table td { border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc; }
上述代碼表示設(shè)置表格中每個單元格的頂部和底部邊框為1px的虛線,顏色為#ccc。
如果要設(shè)置某一行的虛線樣式,可以通過設(shè)置該行每個單元格的邊框來實現(xiàn)。例如,給第二行設(shè)置為虛線樣式:
tr:nth-child(2) td { border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc; }
上述代碼表示選擇表格中第二行的每個單元格,設(shè)置它們的頂部和底部邊框為1px的虛線,顏色為#ccc。
還可以通過設(shè)置“border-collapse”屬性為“collapse”來實現(xiàn)相鄰單元格的邊框合并,使得虛線效果更加連續(xù)。例如:
table { border-collapse: collapse; } tr:nth-child(2) td { border-top: 1px dashed #ccc; border-bottom: 1px dashed #ccc; }
上述代碼表示設(shè)置表格的邊框合并,然后給第二行的單元格設(shè)置為1px的虛線。
通過上述方法,就可以實現(xiàn)CSS表格里行的虛線設(shè)置。