hover改变子标签/同级标签样式

来源:互联网 发布:什么是源码 编辑:程序博客网 时间:2024/06/05 11:15
<body><style>    .first {        color: #5d756e;    }    .first:hover + .fourth {        color: red    }    /*>或空格均可用于子代选择*/    .first:hover > .first-child {        color: #000000    }    .first:hover + .second {        color: rgba(0, 0, 0, 0.38);    }    .first:hover + .second > .third {        color: #0000FF;    }    /* ‘+’ 用于同级选择 */    /* ‘>’ 或 ‘ ’ 用于后代选择 */    </style><div class='first'>计划hover元素    <div class="first-child">hover元素的子元素</div></div><div class='second'>紧邻hover的下个同级元素    <div class='third'>紧邻hover的下个同级元素的子元素</div></div><div class="fourth" style="">非紧邻hover的同级元素,无法改变</div></body>
阅读全文
1 0