E:last-child

語法:

E:last-child { sRules }

說明:

相符父元素的最後一個子元素E。
  • 要使該屬性生效,E元素必須是某個元素的子元素,E的父元素最高是body,即E可以是body的子元素
  • E:last-child選擇符,E必須是它的兄弟元素中的最後一個元素,換言之,E必須是父元素的最後一個子元素。與之類似的偽類還有E:first-child,只不過情況正好相反,需要它是第一個子元素。
  • 通過具體的例子來進行理解:

    有效的程式碼:

    p:last-child{color:#f00;} <div> <h2>我是一個標題</h2> <p>我是一個p</p> </div>

    無效的程式碼:

    p:last-child{color:#f00;} <div> <p>我是一個p</p> <h2>我是一個標題</h2> </div>

    在上述程式碼中,如果我們要設定第一個li的樣式,那麼程式碼應該寫成li:first-child{sRules},而不是ul:first-child{sRules}

兼容性:

  • 淺綠 = 支援
  • 紅色 = 不支援
  • 粉色 = 部分支援
IE Firefox Chrome Safari Opera iOS Safari Android Browser Android Chrome
6.0-8.0 2.0+ 4.0+ 3.1+ 3.5+ 3.2+ 2.1+ 18.0+
IE9.0+

示例: