proprietà CSS3 transizione
Esempi
Passa il mouse sopra un elemento div, e cambiare a poco a poco la larghezza della tabella da 100px a 300px ::
div
{
width: 100px;
transizione: 2s larghezza;
-webkit-transizione: 2s larghezza; / * Safari * /
}
div: hover {width: 300px;}
{
width: 100px;
transizione: 2s larghezza;
-webkit-transizione: 2s larghezza; / * Safari * /
}
div: hover {width: 300px;}
Prova »
Supporto per il browser
I dati riportati nella tabella rappresentano il primo browser a supportare il numero di versione della proprietà.
Subito dopo la -webkit- digitale, -MS- o -moz- fa a sostegno del prefisso attribuiscono primo numero di versione del browser.
| 属性 | |||||
|---|---|---|---|---|---|
| transition | 26.0 4.0 -webkit- |
10.0 | 16.0 4.0 -moz- |
6.1 3.1 -webkit- |
12.1 10.5 -o- |
Attributo definizioni e le istruzioni
proprietà di transizione è una proprietà scorciatoia ha quattro attributi: transizione di proprietà, la transizione di durata, transizione-timing-funzione, e la transizione di ritardo.
Nota: Specificare sempre di proprietà di transizione della durata, altrimenti la durata di 0, la transizione non avrà alcun effetto.
| predefinito: | tutto 0 facilità 0 |
|---|---|
| ereditarietà: | no |
| versione: | CSS3 |
| sintassi JavaScript: | oggetto .style.transition = "2s di larghezza" |
grammatica
transizione: proprietà di ritardo di temporizzazione funzione della durata;
| 值 | 描述 |
|---|---|
| transition-property | 指定CSS属性的name，transition效果 |
| transition-duration | transition效果需要指定多少秒或毫秒才能完成 |
| transition-timing-function | 指定transition效果的转速曲线 |
| transition-delay | 定义transition效果开始的时候 |