Css - 最後一個表格行不管TD或TH

如何使用一個CSS選擇器，它總是能夠捕捉表格的最後一行並將規則應用於最後一個分區，而不管它是TD還是TH，但是不改變表中的最後一個TH。Css - 最後一個表格行不管TD或TH

我現在的規則只適用於如果它是一個TD，並且我發現所有的方法使TH變成圓形，即使其中有更多的TD，它也會變圓。

.tabGeral tr:first-child th:first-child { 
    border-top-left-radius:14px; 
} 
.tabGeral tr:first-child th:last-child { 
    border-top-right-radius:14px; 
} 
.tabGeral tr:last-child td:last-child { 
    border-bottom-right-radius:14px; 
} 
.tabGeral tr:last-child td:first-child{ 
    border-bottom-left-radius:14px; 
}

前兩名分別是期望的結果，這兩個底部是我實現什麼 Top two are the desired result, the two below is what I'm achieving

的jsfiddle：https://jsfiddle.net/rd48cfw8/3/

兩個深綠色的是THS，淺色的綠色一個TD，我需要他們是TH和TD，因爲桌面分揀機。

如果我只用tr:last-child td:first-child，第二個表沒有實現，如果我只用tr:last-child th:first-child，第一個表沒有實現，如果我使用兩者的組合，我得到第四個表，不需要。

來源

2015-05-08 Kriggs

如果您爲我們提供HTML和CSS的Fiddle/CodePen /代碼片段，它會更容易幫助您。 – Dinei

@ DineiA.Rockenbach https://jsfiddle.net/rd48cfw8/ – Kriggs

OT：您正在錯誤地使用表格元素。它看起來像''被用於造型，他們爲不同的目的。 –

，讓你會用

tr:nth-last-child(2) {}

然後你可以在td與

這將選擇從後面第一個樣式，以便

tr:nth-last-child(1) {}

將是非常的倒數第二個錶行最後一個孩子等等。

您可以風格在倒數第二tr的td這樣

tr:nth-last-child(2) td { 
    (whatever styling you want.) 
}

UPDATE：

這裏是一個小提琴我固定它：

.tabGeral:last-child tr:last-child th { 
    -webkit-border-bottom-right-radius: 9px; 
    -webkit-border-bottom-left-radius: 9px; 
    -moz-border-radius-bottomright: 9px; 
    -moz-border-radius-bottomleft: 9px; 
    border-bottom-right-radius: 9px; 
    border-bottom-left-radius: 9px; 
}

JSFIDDLE

來源

2015-05-08 18:05:03 Flo

用你的小提琴更新。 – Flo

爲什麼不使用隱藏在桌面上的溢出這樣它就可以切斷邊界半徑

來源

2015-05-08 18:20:04 DCdaz

Css - 最後一個表格行不管TD或TH

回答

相關問題