Hoe te maken: Zoomen bij hover

Leer hoe je elementen met CSS kunt zoomen bij hover.

Zoomen bij hover

Plaats de muis over het groene vakje:

Hoe te zoomen bij hover

<style>
.zoom {
  inleg: 50px;
  achtergrondkleur: groen;
  overgang: transform 0.2s; /* Animatie */
  breedte: 200px;
  hoogte: 200px;
  marge: 0 auto;
}
.zoom:hover {
  transform: schaal(1.5); /* (150% zoom - Let op: als de zoom te groot is, zal het buiten het zichtbereik vallen） */
}
</style>
<div class="zoom"></div>

Try it yourself

Related pages

Tutorial:CSS transformation