我有一个div在这个div是一个图像和一个标签。我希望如果我悬停在div上,图像的边框颜色会改变,但它不起作用。只有当我直接悬停在图像上时,边框颜色才会改变。你能帮我吗?
null
.item {
display: flex;
flex-direction: column;
align-items: center;
margin: 0 10px;
}
.item:hover {
border-color: @textColor;
}
.item img {
border: transparent 4px solid;
border-radius: 20%;
padding: 5px;
width: 120px;
height: 120px;
}
<div class="item">
<img src="https://via.placeholder.com/120">
<label>Transfer</label>
</div>
null
使用。item:hover img
而不是。item:hover
:
null
.item {
display: flex;
flex-direction: column;
align-items: center;
margin: 0 10px;
}
.item:hover img {
border-color: red;
}
.item img {
border: transparent 4px solid;
border-radius: 20%;
padding: 5px;
width: 120px;
height: 120px;
}
<div class="item">
<img src="https://via.placeholder.com/120">
<label>Transfer</label>
</div>