Átmeneti tulajdon - CSS-trükkök

Anonim

Az a transition-propertytulajdonság, amelyet általában a transitiongyorsírás részeként használnak, meghatározza, hogy mely tulajdonságra vagy tulajdonságokra kívánja alkalmazni az átmeneti hatást.

Ez úgy történik, hogy a tulajdonság nevét adja meg értékként:

.example ( transition-property: color; )

Az érték a következő lehet:

  • Egyetlen tulajdonságnév, mint a fenti példában
  • Vesszővel elválasztott tulajdonságnévlista (gyors vagy hosszú kéz), több tulajdonság egyetlen elemre történő átállításához
  • A kulcsszó none, amely azt jelzi, hogy egyetlen tulajdonság sem változik át
  • A kulcsszó all, amely azt jelzi, hogy az összes tulajdonság átáll (alapértelmezett)

Amikor vesszővel elválasztó az értékeket, a tulajdonságneveket lényegében leképezve a többi átmeneti meghatározott tulajdonságokkal ( transition-timing-function, transition-duration, és transition-delay). Tehát ez azt jelenti, hogy ha a tulajdonságok vesszővel elválasztott listája tartalmaz egy vagy több érvénytelen tulajdonságnevet, a többi tulajdonság továbbra is áttér, és a tervezett kapcsolódó átmeneti tulajdonságokhoz fog társulni.

A specifikáció ezt írja le:

"(U) nem felismert vagy nem animálható tulajdonságokat a listában kell tartani az indexek egyezésének megőrzése érdekében."

Ha értéke nonevagy az egyetemes kulcsszavak inheritvagy initialezek az értékek nem használhatók részeként vesszővel elválasztott listáját, különben ez azt eredményezi, szintaktikai hiba, és az egész sort figyelmen kívül hagyja.

Az összes támogató böngésző kompatibilitásához szállító előtagokra van szükség, a szabványos szintaxissal utoljára deklarálva:

.example ( -webkit-transition-property: color; -moz-transition-property: color; -o-transition-property: color; transition-property: color; )

Az IE10 (az IE első támogatott stabil verziója transition-property) nem igényli az -ms-előtagot.

Böngésző támogatás

Króm Szafari Firefox Opera AZAZ Android iOS
Művek Művek 4+ 10,5+ 10+ 2.1+ 3.2+