CSS3 后續兄弟組合器 (~)

定義和用法

CSS 后續兄弟組合器 (~) 匹配所有在第一個元素 (element1) 之后出現的 element2。

element1 和 element2 必須共享相同的父元素，但 element2 不必緊跟在 element1 之后。

實例

選擇并設置所有在 <p> 元素之后且共享相同父元素的 <ul> 元素的樣式：

p ~ ul {
  background-color: gold;
  border: 1px solid gray;
}

親自試一試

CSS 語法

element1 ~ element2 {
  css declarations;
}

技術細節

版本： CSS3

瀏覽器支持

表格中的數字表示完全支持該組合器的首個瀏覽器版本。

Chrome Edge Firefox Safari Opera
4.0 7.0 3.5 3.2 9.6