CSS 是一種用于美化網頁的語言,它能夠對網頁中的表格進行美化和排版。下面我們來看一些使用 CSS 增加表格格的方法。
/* 為 table 的所有單元格添加邊框 */ table { border-collapse: collapse; } td { border: 1px solid black; } /* 交錯顏色顯示表格行 */ tr:nth-child(odd) { background-color: #f2f2f2; } /* 懸停效果,鼠標移到表格行上時背景顏色變化 */ tr:hover { background-color: #d9d9d9; }
上述代碼使用了一些常見的 CSS 樣式,如border-collapse
、border
、background-color
等。其中,border-collapse: collapse;
是使邊框重疊的設置,border
可以設置邊框的寬度、顏色和樣式,background-color
則是設置背景顏色。
使用nth-child
選擇器可以實現交錯顏色顯示表格行的效果。這里的odd
表示選擇奇數行,如果要選擇偶數行,可以使用even
。
最后一個效果是懸停效果,也可以稱為鼠標懸停效果。這里使用了:hover
選擇器,表示當鼠標移到表格行上時,對其進行樣式設置。
通過以上幾種方法,我們可以使用 CSS 美化和增強表格的樣式和顯示效果,使其更加美觀和易于閱讀。
上一篇css圖片兼容上下居中
下一篇java邏輯和對象