黑松山资源网 Design By www.paidiu.com

可选择紧接在另一个元素后的元素,且二者有相同的父级元素 下面代码中,item2和item3会有效果,而item1不会有
HTML代码:

XML/HTML Code复制内容到剪贴板
  1. <ul>  
  2.     <li>item1</li>  
  3.     <li>item2</li>  
  4.     <li>item3</li>  
  5. </ul>  

CSS代码:

CSS Code复制内容到剪贴板
  1. li+li { font-size: 50px; }  

1、如果需要选择紧接在另一个元素后的元素,而且二者有相同的父元素,可以使用相邻兄弟选择器。
2、相邻兄弟选择器使用加号“+”做为连接符。

示例

XML/HTML Code复制内容到剪贴板
  1. <html>  
  2.   
  3. <head>  
  4.     <style type="text/css">  
  5.         #p1 + p {   
  6.             margin-top: 50px;   
  7.         }   
  8.     </style>  
  9. </head>  
  10.   
  11. <body>  
  12.     <p id='p1'>This is paragraph 1.</p>  
  13.     <p id='p2'>This is paragraph 2.</p>  
  14.     <p id='p3'>This is paragraph 3.</p>  
  15.     <p id='p4'>This is paragraph 4.</p>  
  16. </body>  
  17.   
  18. </html>  

CSS的相邻兄弟选择器用法简单讲解

黑松山资源网 Design By www.paidiu.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
黑松山资源网 Design By www.paidiu.com