<body><div id="a" style="background:#0F0; height:100px; width:100px;"> <div id="c" style="background:#FF0; height:50px; width:50px;"> </div></div> <div id="b" style="background:#900; height:200px; width:200px;"></div> </body>
#c{ display:none;}
#b{display:none;}
#a:hover+#b{
display:block;
}
#a:hover #c{
display:block;}
c是a的子元素，使用a控制c的样式时，为 #a:hover #c{}
b是a兄弟元素，使用a控制b的样式时，要用+,为#a:hover+#b{}
需要改变样式一定都要写在css中，如果写在html中，由于在html优先级高，则改变的样式不会改变
ps：:hover为悬浮，即悬浮在a块上时，改变b c的样式
时间： 2024-12-23 10:28:02