1
我找不到一種方法來使<input type="image>
在用戶點擊時變成一種顏色,這意味着圖像佔據的空間將被普通顏色替換。我的代碼如下:如何在點擊時用顏色覆蓋輸入圖像?
input:focus{
color:#0C6
}
和
<input type="image" src="image.jpg" />
我找不到一種方法來使<input type="image>
在用戶點擊時變成一種顏色,這意味着圖像佔據的空間將被普通顏色替換。我的代碼如下:如何在點擊時用顏色覆蓋輸入圖像?
input:focus{
color:#0C6
}
和
<input type="image" src="image.jpg" />
你需要具有所需顏色的父包裝,
和輸入:focus
使它透明使用opacity
.imageWrapper{
display: inline-block;
background: #0C6;
}
.imageWrapper input[type=image]{
vertical-align: top;
transition: 0.3s; /* fade nicely :) */
}
.imageWrapper input[type=image]:focus{
opacity: 0;
}
<span class="imageWrapper">
<input type="image" src="//placehold.it/60x60/f00">
</span>