1 回答

TA貢獻(xiàn)1829條經(jīng)驗(yàn) 獲得超6個(gè)贊
使用.class:hover
基本上,當(dāng).image懸停時(shí),我們想要更改 的樣式.text。CSS 查詢.image:hover + .text選擇該.text元素,該元素之前有一個(gè)圖像懸停在該元素之前。
.image {
width: 250px;
}
.text {
max-height: 0px;
overflow: hidden;
transition: max-height 1s;
}
.image:hover + .text {
max-height: 32px;
}
<div class="wrapper">
<img class="image" src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg" />
<p class="text">This is some text</p>
</div>
<div class="wrapper">
<img class="image" src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__340.jpg" />
<p class="text">This is some text</p>
</div>
- 1 回答
- 0 關(guān)注
- 117 瀏覽
添加回答
舉報(bào)