Css hover ảnh đẹp

 

.homecat-pic {

    height: 150px;

    width: 100%;

    transition: all 0.3s ease-out;

    --deg: 100deg;

}

.homecat-pic img {

    width: 100%;

    height: 100%;

    object-fit: contain;

    padding: 20px;

}

.homecat-pic:hover img {

    animation: tada 2s infinite;

    filter: brightness(1.05);

}

@keyframes tada {

  0% {

    transform: scaleX(1); }

  10%,

  20% {

    transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); }

  30%,

  50%,

  70%,

  90% {

    transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); }

  40%,

  60%,

  80% {

    transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); }

  to {

    transform: scaleX(1); } }