2017-07-15 45 views
1

我想知道您是否可以在div中使用宽度为50px,高度为100px的黄金背景文字,并且当您将鼠标悬停在该框上时,它会变为图像。如何用图像替换文字

此外,我该如何调整他们彼此相邻,像这样:

⬛️⬛️⬛️

⬛️⬛️⬛️

⬛️⬛️⬛️

用于在页面上的商店中分类。

谢谢。

回答

1

.mainDiv{ 
 
    background-color:gold; 
 
} 
 
.mainDiv:hover{ 
 
    color:transparent; 
 
    background-image:url('https://www.gstatic.com/webp/gallery3/1.png'); 
 
}
<div class="mainDiv" height="200px" width="200px"> 
 
    Some Text<br><br> 
 
    Some Text<br><br> 
 
    Some Text<br><br> 
 
    Some Text<br><br> 
 
</div>

+0

哇,你的传奇效果非常好,谢谢。 –

+0

@CødedNumbers感谢您的赞赏..... –

1

试试这个

<style> 
    div{ 
     background-color: black; 
     height: 200px; 
     width:200px; 
    } 
    div:hover{ 
     font-size:0px; 
     background-image: url('https://www.w3schools.com/css/img_fjords.jpg'); 

    } 
</style> 
<div> 

</div> 
+0

非常感谢两个答案的工作!只是我希望他们如何。 –