CSS3 element1~element2 选择器
设置同一父元素下的 p 元素之后的每一个 ul 元素的背景颜色:
<!DOCTYPE html> <html> <head> <style> p~ul { background: #ff0000; } </style> </head> <body> <div>A div element.</div> <ul> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ul> <p>The first paragraph.</p> <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> </body> </html>
定义和用法
element1~element2 选择器匹配出现在 element1 后面的 element2。
element1 和 element2 这两种元素必须具有相同的父元素,但 element2 不必紧跟在 element1 的后面。
浏览器支持
所有主流浏览器都支持 element1~element2 选择器。
注意:要想在 IE8 及其之前的版本中使用这个选择器,必须声明 <!DOCTYPE>。