04.CSS选择器-->相邻、通用兄弟选择器

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        /*相邻兄弟选择器*/
        /*h1 + p{
            color: red;
        }*/
        /*通用兄弟选择器*/
        h1 ~ p{
            color: red;
        }
    </style>
    <title>相邻兄弟选择器,通用兄弟选择器</title>
</head>
<body>
<!--相邻兄弟选择器   相邻的兄弟,必须严格相邻,不允许出现其他元素间隔-->
<!--通过兄弟选择器   所有的同级兄弟  不要求严格相邻 -->
<h1>好好学习</h1>
<span>ccy</span>
<p>好好学习1</p>
<p>好好学习2</p>
<p>好好学习3</p>
<p>好好学习4</p>
<p>好好学习5</p>
</body>
</html>

  

posted @ 2017-10-10 19:29  Smart.User.It  阅读(4013)  评论(0)    收藏  举报