Proprietà transition-duration
La proprietà transition-duration imposta
la durata di una transizione fluida transition.
Sintassi
selettore {
transition-duration: tempo in s o ms;
}
Valori
| Valore | Descrizione |
|---|---|
s |
Specifica il tempo in secondi (ad esempio 3s).
È possibile specificare valori frazionari,
ad esempio, 0.5s - mezzo secondo.
|
ms |
Specifica il tempo in millisecondi (ad esempio 3ms).
Un secondo è 1000 millisecondi.
|
Valore predefinito: 0s.
Esempio
Passa il mouse sul blocco - cambierà la sua
larghezza in modo fluido in 2 secondi.
<div id="elem"></div>
#elem {
transition-duration: 2s;
transition-property: width;
border: 1px solid black;
height: 50px;
width: 100px;
}
#elem:hover {
width: 400px;
}
:
Vedi anche
-
la proprietà
transition-property,
che specifica il nome della proprietà per una transizione fluida -
la proprietà
transition-delay,
che specifica il ritardo prima di una transizione fluida -
la proprietà
transition-timing-function,
che specifica la funzione di temporizzazione per una transizione fluida -
la proprietà
transition,
che è una scorciatoia per una transizione fluida -
la proprietà
animation,
con cui è possibile creare un'animazione