Sintassi

Significato dei valori principali:

• number: indica un fattore di scala numerico. Ad esempio, 1.5 ingrandisce del 150%, 0.5 rimpicciolisce al 50%.

• percentage: equivalente al valore numerico, ma espresso in percentuale. Esempio: 150% è come 1.5.

• normal: imposta lo zoom a 1 (valore predefinito, nessuna scala).

✅ Compatibilità:
Ben supportata in Chrome, Edge, Safari e versioni recenti di Firefox (con limitazioni).

❌ Non raccomandata
per layout CSS critici o produzione moderna.

Esempio proprietà: zoom

Codice Esempio: zoom

CODE: CSS

1. .zoom-example {

2.   zoom: 1.5;

3.   background-color: #d1e7dd;

4.   padding: 20px;

5.   font-size: 20px;

6.   border: 2px solid #0f5132;

7.   width: 200px;

8. }

Contenuto Esempio: zoom

  
  <style>
   .zoom-example {
    background-color: #d1e7dd;
    padding: 20px;
    font-size: 20px;
    border: 2px solid #0f5132;
    width: 150px;
   }
   .zoom-example:hover {
    zoom: 1.5;
   }
  </style>

  <div class="zoom-example">
    Passa il mouse qui Contenuto ingrandito con zoom
  </div>
  

⚠️ Nota compatibilità: la proprietà zoom non è standard e non è garantito che funzioni in tutti i browser o che continui a essere supportata in futuro. Per comportamento simile e conforme agli standard CSS3, considera l'uso di transform: scale().

Note:
Le indicazioni dei Browser supportati sono superate grazie alla loro costante evoluzione, si consiglia di verificare la compatibilità dei vari browser eseguendo il test cliccando qui sotto.

Supporto Browser