Välja Rätt Övergångsegenskaper

Vi kan ange vilken CSS-egenskap som helst som ett värde för egenskapen transition-property. Det innebär att vi kan tillämpa en övergångseffekt på vilken egenskap som helst.

transition-property: ... /* any property */

Vi arbetar med några vanliga egenskaper som ofta används vid övergångar. Egenskaperna transition-duration, transition-timing-function och transition-delay förblir alltid desamma. Alla övergångar reagerar på när markören hovrar.

Flera övergångsegenskaper

Vi kan också använda värdet all för egenskapen transition-property, vilket innebär att alla egenskaper kommer att övergå.

transition-property: all;

I följande exempel vill vi övergå förändringen av egenskaperna background-color, color, font-weight och font-size. Granska filen index.css:

Om vi behöver lägga till en övergång på flera egenskaper men inte alla, kan vi ange dem som värde för egenskapen transition-property, separerade med mellanslag. Till exempel:

transition-property: color border height;

Det betyder att övergången kommer att tillämpas på egenskaperna color, border och height.