頭上應用CSS和我的表在1條單行身體

用下面的CSS我定義我的表頭上應用CSS和我的表在1條單行身體

table.search-transport tr th:nth-child(1) { width: 30px; text-align:right; }

頭的第一個關口，我想不僅在應用此CSS頭部，但也在桌子的身體。

我知道我們可以在2線進行：

table.search-transport tr th:nth-child(1), 
table.search-transport tr td:nth-child(1) 
        { width: 30px; text-align:right; }

但我想知道，如果我們能在1條SIGNE線繼續嗎？例如：

table.search-transport tr th:nth-child(1) + td:nth-child(1) { width: 30px; text-align:right; }

謝謝。

來源

2013-03-21 Bronzato

只要它是第一列中的任何單元格？您應該完全可以省略完整的th/td部分，並且可以使用子選擇器，因爲tr作爲孩子只能有th或td（並且您希望確保只選擇其子和沒有任何內部元素）：

table.search-transport tr > :nth-child(1) { width: 30px; text-align: right; }

（如果你想支持舊的瀏覽器與:first-child取代:nth-child(1)）

一般來說，但是，你不能同時選擇th:nth-child(1)和td:nth-child(1)分開，同時避免複製。選擇器的其餘部分。這已被覆蓋到網站上的其他地方，但請參閱here瞭解更多信息。

來源

2013-03-21 17:39:03 BoltClock

您提出的解決方案的問題是我在第一個單元格中有一個標籤，並且此標籤也受到影響。 – Bronzato 2013-03-21 17:44:06

@Bronzato：很好。我編輯了我的答案。 – BoltClock 2013-03-21 17:44:44

非常感謝。 – Bronzato 2013-03-21 17:54:32

您正在使用的CSS選擇器目前在性能方面很差。

以下行回答你的問題。

.search-transport tr > :nth-child(1) { width: 30px; text-align: right; }

檢查小提琴在行動中看到http://jsfiddle.net/LNJLf/

來源

2013-03-21 17:40:38

我猜你正在尋找:any僞類選擇。見https://developer.mozilla.org/en-US/docs/CSS/:any。

table.search-transport tr :any(th,td):nth-child(1) { width: 30px; text-align:right; }

注意：您需要以供應商爲前綴。未經測試。

來源

2013-03-21 17:47:48

您不僅需要爲此添加前綴，而且必須根據有多少瀏覽器使用前綴，根據需要多次重複*整個規則*（請參見[this]（http://stackoverflow.com/questions/）例如10753174/css3-combining-selectors-with-or-or-and-and/10753216＃10753216），這使得它甚至比問題中已經存在的更糟。換句話說，它是適得其反的，並且在目前的形式中是無用的。 – BoltClock 2013-03-21 17:48:32

此外，該前綴的版本被指定爲['：matches（）']（http://www.w3.org/TR/selectors4/#matches）。 – BoltClock 2013-03-21 17:57:26

頭上應用CSS和我的表在1條單行身體

回答

相關問題