如何選擇元素中除最後一個孩子之外的全部孩子?

我如何使用CSS3選擇器選擇除最後一個孩子之外的全部孩子? css

例如,僅獲取最後一個孩子將是div:nth-last-child(1)瀏覽器


#1樓

Nick Craver的解決方案有效,但您也能夠使用如下方法: ide

:nth-last-child(n+2) { /* Your code here */ }

CSS Tricks的Chris Coyier爲此作了一個不錯的:nth測試人員測試


#2樓

您能夠對:last-child僞類使用否認僞類:not() 。 正在被引入CSS選擇器3級,它不適用於IE8或更低版本: spa

:not(:last-child) { /* styles */ }

#3樓

當IE9出現時,它將變得更加容易。 可是,在不少時候,您能夠將問題切換到要求:first-child的樣式,並設置元素的另外一面(IE7 +)的樣式。 code


#4樓

簡單點:

您能夠將樣式應用於全部div,而後使用:last-child從新初始化最後一個樣式: get

例如在CSS中io

.yourclass{
    border: 1px solid blue;
}
.yourclass:last-child{
    border: 0;
}

或在SCSS中ast

.yourclass{
    border: 1px solid rgba(255, 255, 255, 1);
    &:last-child{
        border: 0;
    }
}
  • 易於閱讀/記住
  • 快速執行
  • 瀏覽器兼容 (IE9 +,由於它仍然是CSS3)

#5樓

從最後查找元素,使用 class

<style>
ul li:nth-last-of-type(3n){ color:#a94442}  /**/
</style>
相關文章
相關標籤/搜索