CSS中的tr
原樣式刪除是一種非常有用的技巧,用于定制表格的樣式。在默認(rèn)情況下,tr
標(biāo)簽的樣式與表格的樣式密切相關(guān),因此我們需要使用原樣式刪除來(lái)消除這些默認(rèn)樣式。
原樣式刪除可以通過(guò)添加以下代碼來(lái)實(shí)現(xiàn):
tr { margin: 0; padding: 0; border: none; outline: none; font-size: 100%; vertical-align: baseline; }
這些代碼將刪除tr
標(biāo)簽的所有默認(rèn)樣式,從而使你能夠自由地定制表格的外觀。
例如,你可以使用下面的CSS代碼來(lái)創(chuàng)建具有自定義樣式的表格:
table { border-collapse: collapse; border-spacing: 0; width: 100%; background-color: #fff; color: #333; font-family: Arial, sans-serif; font-size: 14px; text-align: left; } th, td { padding: 10px 15px; border: 1px solid #ccc; } th { background-color: #f7f7f7; font-weight: bold; } tr:nth-child(even) { background-color: #f2f2f2; } tr:hover { background-color: #ddd; }
在這個(gè)例子中,我們使用了原樣式刪除來(lái)確保表格的tr
標(biāo)簽沒(méi)有任何默認(rèn)樣式。然后,我們編寫(xiě)了一些基本的CSS代碼,包括設(shè)置表格的 overall 樣式、表頭和單元格的樣式以及偶數(shù)行和懸停狀態(tài)下的樣式。
總的來(lái)說(shuō),使用CSS中的原樣式刪除可以幫助我們建立更具有自定義化,更專業(yè)的網(wǎng)站設(shè)計(jì),并對(duì)表格進(jìn)行精細(xì)調(diào)整。