Блог

Когда я навожу курсор на изображение, фон меняется на желтый. Изображение круглое, но фон остается прямоугольным. Как сделать, чтобы размер фона совпадал с размером изображения при наведении курсора мыши на изображение с помощью CSS?

 body {
  background-color: #393b44;
  color: #8d93ab;
  font-family: helvetica;
}

hr {
  border-color: #8d93ab;
  border-width: 5px;
  border-style: dotted none none;
  width: 5%;
}

h1 {
  color: #8d93ab;
}

h3 {
  color: #8d93ab;
}

a:link {
  color: #d6e0f0;
  text-decoration: none;
}

a:hover {
  color: yellow;
}

img:hover {
  background-color: #393b44;
  transform: scale(.85);
}  

Вы должны добавить свой код с вопросом,

Это может быть полезно:

 wrap the img inside a div
<div><img src="" ></div>
  

и добавьте стили к div

 div {

  width:200px;
  height:200px;
  display:block;
  background-color:yellow;

}