Generator de tranziție CSS3
Tranziție lină a opacității
Presetări populare
Efect de estompare
Tranziție lină a opacității
Efect de scară
Redimensionarea elementului la trecerea cu mouse-ul
Efect de rotire
Rotire element la trecere cu mouse-ul
Efect de glisare
Mutați poziția elementului
Schimbarea culorii
Tranziția culorii de fundal
Despre tranziții
Tranzițiile CSS vă permit să modificați valorile proprietăților fără probleme, pe o anumită durată.
Proprietățile animate în mod obișnuit includ:
- lățime, înălțime
- margine, umplutură
- opacitate, culoare
- transform (scale, rotate, translate)
- background-color
Sfat profesionist: Utilizați opțiunea "Toate proprietățile" pentru a anima toate modificările.
Preview
Cod generat
.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; } .element:hover { /* Hover styles will be generated here */ }
Controale de tranziție
Efecte de trecere
Related Tools
Creați machete Flexbox perfecte
Vizualizați, personalizați și generați cod CSS flexbox cu interfața noastră intuitivă drag-and-drop.
Convertor Stylus în CSS
Transformați-vă codul SCSS în CSS. Rapid, ușor și sigur.
Convertor SCSS în CSS
Transformați-vă codul SCSS în CSS. Rapid, ușor și sigur.
Calculator de marjă
Calculați marja de profit, marja brută și adaosul cu calculatorul nostru cuprinzător de marjă.
Convertor de unități de densitate de stocare
Convertiți între diferite unități de densitate de stocare a datelor cu precizie
Convertiți JSON în Excel fără efort
Transformați-vă datele JSON în format Excel cu un singur clic. Rapid, sigur și complet bazat pe browser.