画像と背景色について

Question

前提・実現したいこと

htmlで指定した背景はグレーなのですが画像の背景は白でその部分だけ白くなります。
それをグレーにする方法を教えてください。。

該当のソースコード

<div class="footer">`

<div class="boxs">
              <a href="#"><img src="./images/twitter5.png" class="twitter"></a>
        
</div>

</div>

div.footer {
    background-color: #f7f7f7;
    border-top: 1px solid #dddddd;
    
}

div.boxs {
    width: 10%;
    margin-top: -20px;
}
img.twitter {
    width: 20%;
}

Answer 1

htmlで指定した背景はグレーなのですが画像の背景は白でその部分だけ白くなります。

画像の背景は白　→　その部分だけ白くなります。

ということは、

画像の背景をグレーにする　→　その部分はグレーになる

と理解しましたが、誤解していますか?
画像の背景をグレーにするといいのでは? と思います。

---

それをグレーにする方法を教えてください。。

もしかして、ホバーしないときは画像の背景が白の状態、ホバーすると画像の背景がグレーの状態になる、
ということをしたいということでしょうか?

• 背景が白の画像、背景がグレーの画像の2枚を用意する必要があるかもしれません。
• 背景が透過の画像を用意し、background-color: #fff;を指定し、ホバーしたときにグレーを指定する、という方法で実現できるかもしれません。