CSS 依照兄弟元素來調整你的CSS樣式

說明

這是由 André Luís 文章中提出的。

在這個範例中，允許1~3個相鄰的元素均分整個父元素的寬度。


當然，你也可以透過更改css，來達成不同的樣式，而不只是寬度。

範例

/* 只有一個元素 */  

li:nth-child(1):nth-last-child(1) {  

width: 100%;  

}  

/* 兩個元素 */  

li:nth-child(1):nth-last-child(2),  

li:nth-child(2):nth-last-child(1) {  

width: 50%;  

}  

/* 三個元素 */  

li:nth-child(1):nth-last-child(3),  

li:nth-child(2):nth-last-child(2),  

li:nth-child(3):nth-last-child(1) {  

width: 33.3333%;  

}  

...