我有以下的選擇,這是爲了給一個表中的第一行適當的邊界半徑屬性:選擇者看着孩子,然後是孫子,而不是孫子?
table.alt tr:first-of-type > *:first-of-type { border-radius: 5px 0 0 0 }
table.alt tr:first-of-type > *:last-of-type { border-radius: 0 5px 0 0 }
table.alt tr:first-of-type > *:only-child { border-radius: 5px 5px 0 0 }
當時的想法是允許出現任何第一行,無論是在表頭或桌體,以便在左上角和右上角需要邊框半徑進行正確的風格化。我希望排除thead
/tbody
/tfoot
部分,它只會查找表中的第一個表格行,但似乎並非如此。它需要分別匹配thead
/tbody
/tfoot
中的每一箇中的第一個表格行。因此,它似乎是運行選擇更是這樣的:
table.alt > * > tr:first-of-type > *:first-of-type { border-radius: 5px 0 0 0 }
table.alt > * > tr:first-of-type > *:last-of-type { border-radius: 0 5px 0 0 }
table.alt > * > tr:first-of-type > *:only-child { border-radius: 5px 5px 0 0 }
這很容易通過使用*:not(tfoot)
固定爲表尾,但仍然是thead
和tbody
元素區分的問題。儘管我的表格中大部分都會有表格標題,而不是全部是。
有什麼辦法可以避開這種困境,或者是將邊界半徑應用於表格所有角落的更好的選擇?
注意:我會爲每個表格單元應用背景顏色,因此它與外部表格的邊框半徑重疊。我還在最後一節中使用*
,以便它可以匹配th
或td
。