Sie können für verschiedene HTML-Elemente einen Zoomeffekt erstellen, indem Sie die CSS-Eigenschaft `scale()` mit der Pseudoklasse `:hover` verwenden.
Hier ist ein grundlegendes Beispiel, wie Sie einen Zoomeffakt auf ein Bild anwenden können, wenn der Mauszeiger darüber schwebt:
```css
.img-zoom:hover {
transform: scale(1.2);
transition: transform .2s;
}
```
In diesem Beispiel skaliert die CSS-Eigenschaft `transform: scale(1.2);` das Bild um den Faktor 1.2, und die `transition: transform .2s;` macht den Übergang sanft innerhalb von 0.2 Sekunden.
Bitte beachten Sie, dass die CSS-Eigenschaft `transform` den Inhalt des Elements verschiebt, skaliert, kippt, dreht oder in den dreidimensionalen Raum schiebt und das Element muss die Positionseigenschaften anders als statisch haben (`relative`, `absolute`, `fixed` oder `sticky`).
Auch wäre es hilfreich, `overflow: hidden;` auf den Behälter des Elements anzuwenden, um sicherzustellen, dass beim Vergrößern keine Teile des Elements über die Grenzen des Behälters hinaus sichtbar werden.
Wenn Sie das CSS auf Ihr HTML-Element anwenden, muss es ungefähr so aussehen:
```html
```
