最後一個孩子無法工作的邊界。爲什麼？

Question

不能理解什麼問題 https://jsfiddle.net/ure6o695/1/

#wrapper > div { 
float: left; 
border-left: 1px solid; 
border-color: #ff0303; 
font-family: Aller_Rg; 
padding:21px; 

}

#wrapper > div:last-child { 
border-right: 1px solid; 
border-color: #ff0303; 

}

#wrapper > img { 
float: right; 

}

div { 
background: green; 

}

Answer 1

你最後div是不是也其父的:last-child，因爲你有兩個img元素：它是不是:last-of-type

#wrapper > div:last-of-type { 
    border-right: 1px solid; 
    border-color: #ff0303; 
} 

叉：https://jsfiddle.net/vmb9zLrv/

---

如果您需要支持舊版瀏覽器（其中:last-of-type僞類不可用，例如IE7或IE8）可以反轉邏輯並將border-right應用於所有div，border-left僅適用於div:first-child。

傳統做法：https://jsfiddle.net/7Lty07zq/1/

Answer 2

更改這個CSS行：

#wrapper > div:last-child { 

要這樣：

#wrapper > div:last-of-type {