Heim >Web-Frontend >HTML-Tutorial >CSS 相邻选择器(七)_html/css_WEB-ITnose

CSS 相邻选择器(七)_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:46:17966Durchsuche

一、相邻选择器

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

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

二、简单例子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="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><strong><p>相邻段落</p></strong></div></body></html>

 

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn