CSS 之关系选择符(RelationShip)
一、选择符
Selectors 选择符 | Name 名称 | Description 简介 |
---|---|---|
E F | 包含选择符(Descendant combinator) | 选择所有被E元素包含的F元素。 |
E>F | 子选择符(Child combinator) | 选择所有作为E元素的子元素F。 |
E+F | 相邻选择符(Adjacent sibling combinator) | 选择紧贴在E元素之后F元素。 |
E~F | 兄弟选择符(General sibling combinator) | 选择E元素所有兄弟元素F。 |
二、示例
<style> p~p{color:#f00;} </style> </head> <body> <div class="test"> <h3>这是一个标题</h3> <p>这是一个文字段落</p> <p>这是一个文字段落</p> <h3>这是一个标题</h3> <p>这是一个文字段落</p> <h3>这是一个标题</h3> <p>这是一个文字段落</p> <p>这是一个文字段落</p> </div> </body>