你的位置:首页 > 网页设计

[网页设计]CSS 相邻选择器(七)


一、相邻选择器

相邻选择器前后部分之间用一个加号(+)隔开,前后两部分选择反符在结构上属于同级关系,如

相邻选择器,是根据左侧选择符指定相邻元素,然后在该相邻元素后面寻找匹配匹配右侧选择符的相信元素

二、简单例子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html ="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>相邻选择器</title><style type="text/css">/*选择中id为wrap最下的p标签使用相信选择器*/#sub_wrap + p{  font-size:22px;  color:red;  }</style></head><body><div id="wrap"><div id="sub_wrap"><h2 class="news">标题2</h2><p class="news">标题2下的段落</p><span class="news">标题2下的span</span></div><p>相邻段落</p></div></body></html>