element1~element2

element1~element2 选择器匹配出现在 element1 后面的 element2。

element1 和 element2 这两种元素必须具有相同的父元素,但 element2 不必紧跟在 element1 的后面。

 

语法

p~ul
{
background:#ff0000;
}

例子

HTML

<div>A div element.</div>
<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

<h2>Another list</h2>
<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

CSS

p~ul
{
background:#ff0000;
}

执行结果

The first paragraph.

A div element.
  • Coffee
  • Tea
  • Milk

The first paragraph.

  • Coffee
  • Tea
  • Milk

Another list

  • Coffee
  • Tea
  • Milk

参考

相关页面

外部链接