关于:hover的一点小问题

今天又用到了:hover这个伪类选择器,一个小问题搞了我好久,就是关于:hover选择的问题,

先看下css代码

.box:hover span {
		height: 150px;
		}

接下来是HTML代码

<div class = 'box'>
		<span></span>
</div>
<div class="childbox"></div>

如果这样,当鼠标经过box大盒子的时候是不可以改变span的高度的(span有display:inline-block属性)

<div class = 'box'>
	<span></span>
	<div class="childbox"></div>
</div>

如果这样,当鼠标经过box大盒子的时候是可以改变span的高度的(span有display:inline-block属性)

 

  也就是  .box:hover  span {}    span只有在是.box的子元素的情况下,才可以被选中,改变相应属性;否则不能选中span标签

原文地址:https://www.cnblogs.com/mr-yuan/p/5898213.html