雖然我已經看過幾篇關于這個主題的帖子，但它似乎對我不起作用。我有：
.button-icon {
height: 25px;
}
.button-type .wp-block-button__link{
color: #33FFFF;
background-color: #FF0000;
border-color: #33FFFF;
border-bottom-style: solid;
}
.button-type .wp-block-button__link:hover{
color: #fff;
background-color: #FF9999;
border-bottom-color: #FF9999;
}
.button-type .wp-block-button__link:hover img * {
filter: brightness(0) invert(1) !important;
}<div class="wp-block-button button-type">
<a href="/link/" class="wp-block-button__link">
<img class="button-icon" src="https://upload.wikimedia.org/wikipedia/commons/1/13/Font_Awesome_5_regular_play-circle.svg"> Go
</a>
</div>我想讓它在滑鼠懸停在父元素上時應用過濾器（所以當你移到“Go”上時）。我究竟做錯了什么？svg 影像在滑鼠懸停在父元素上時不會改變顏色...
uj5u.com熱心網友回復：
洗掉多余的*after img，您需要針對img自身。
.button-icon {
height: 25px;
}
.button-type .wp-block-button__link{
color: #33FFFF;
background-color: #FF0000;
border-color: #33FFFF;
border-bottom-style: solid;
}
.button-type .wp-block-button__link:hover{
color: #fff;
background-color: #FF9999;
border-bottom-color: #FF9999;
}
.button-type .wp-block-button__link:hover img {
filter: brightness(0) invert(1) !important;
}<div class="wp-block-button button-type">
<a href="/link/" class="wp-block-button__link">
<img class="button-icon" src="https://upload.wikimedia.org/wikipedia/commons/1/13/Font_Awesome_5_regular_play-circle.svg"> Go
</a>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/532134.html
標籤：csssvg
上一篇：將文本元素添加到路徑元素的中心
下一篇：留下衰落軌跡的偏移路徑