Den transition-property
egenskapen, som normalt används som en del av transition
stenografi, används för att definiera vilken egendom eller egenskaper du vill använda en övergångseffekt till.
Detta görs genom att ange fastighetens namn som värdet:
.example ( transition-property: color; )
Värdet kan vara något av följande:
- Ett enda fastighetsnamn, som i exemplet ovan
- En kommaseparerad lista med fastighetsnamn (stenografi eller långhand) för att överföra flera egenskaper på ett enda element
- Nyckelordet
none
, vilket indikerar att ingen egendom kommer att övergå - Nyckelordet
all
, som indikerar att alla fastigheter kommer att övergå (standard)
När kommatecken som separerar de värden, är egenskapsnamnen väsentligen avbildas till de andra övergångsegenskaper definierade ( transition-timing-function
, transition-duration
, och transition-delay
). Så detta betyder att om en kommaseparerad lista med egenskaper innehåller ett eller flera egendomsnamn som är ogiltiga, kommer de andra egenskaperna fortfarande att övergå och kommer att mappas till deras avsedda relaterade övergångsegenskaper.
Specifikationen beskriver detta genom att säga:
"(U) icke-kända eller icke-animerbara egenskaper måste hållas i listan för att bevara matchningen av index."
När du använder ett värde på none
eller de universella nyckelorden inherit
eller initial
, kan dessa värden inte användas som en del av en kommaseparerad lista, annars leder detta till ett syntaxfel och hela raden ignoreras.
För kompatibilitet i alla stödjande webbläsare krävs leverantörsprefix, med standardsyntax deklarerad som sist:
.example ( -webkit-transition-property: color; -moz-transition-property: color; -o-transition-property: color; transition-property: color; )
IE10 (den första stabila versionen av IE som stöds transition-property
) kräver inte -ms-
prefixet.
Webbläsarstöd
Krom | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
Arbetar | Arbetar | 4+ | 10,5+ | 10+ | 2.1+ | 3.2+ |