码迷,mamicode.com
首页 > 其他好文 > 详细

层次选择器

时间:2017-11-19 13:33:00      阅读:99      评论:0      收藏:0      [点我收藏+]

标签:css   class   边框   选择器   round   style   通用   ack   --   

<title>层次选择器</title>
<style type="text/css">
p,ul{
border:1px solid red;/*边框属性*/
}

/*后代选择器*/
/*body p{
background:red;
}*/
/*子选择器*/
/*body>p{
background:red;
}*/
/*相邻兄弟选择器*/
/*.ac + p{
background:red;
}
#bc + p{
background:#0F0;
}*/
/*通用兄弟选择器*/
/*.ac~p{
background:#0F0;
}*/

</style>
</head>

<body>
<p class="ac">1</p><!--演示相邻兄弟选择器,在这添加个class-->
<p>2</p>
<p id="bc">3</p>
<p>4</p>
<ul>
<li>
<p>4</p>
</li>
<li>
<p>5</p>
</li>
<li>
<p>6</p>
</li>
</ul>
</body>

层次选择器

标签:css   class   边框   选择器   round   style   通用   ack   --   

原文地址:http://www.cnblogs.com/SFHa/p/7859419.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!