Suositut esiasetukset
Häivytystehoste
Tasainen peittävyyssiirtymä
Skaalaustehoste
Elementin koon muuttaminen osoittimen
Kierrätehoste Kierrä
elementtiä vietäessä
Liukutehoste
Siirrä elementin sijaintia
Värin muutos
Taustavärin siirtymä
Tietoja siirtymistä
CSS-siirtymien avulla voit muuttaa ominaisuuksien arvoja sujuvasti tietyn ajan kuluessa.
Yleisesti animoidut ominaisuudet include:
- leveys, korkeusmarginaali
- , pehmusteen
- peittävyys, väri
- transform (scale, rotate, translate)
- background-color
Ammattilaisvinkki: Käytä "Kaikki ominaisuudet" -vaihtoehtoa animoidaksesi kaikki muutokset.
Preview
HOVER ME
Luotu koodi
.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; } .element:hover { /* Hover styles will be generated here */ }
Siirtymä Ohjaimet
300
0
Tehosteet
100%
100%
0°
0px
0px
8px
8px
Related Tools
Less CSS-muotoon -muunnin
Muunna Less-koodisi CSS:ksi. Nopeaa, helppoa ja turvallista.
CSS3-siirtymägeneraattori
Sujuva peittävyyden siirtyminen
CSS Minifier
Pakkaa ja optimoi CSS-koodisi ammattimaisella tarkkuudella
CSV Base64-muunnin
Muunna CSV-tietosi Base64-koodaukseen nopeasti ja helposti
RGB:stä HSV:ksi
varten Muunna RGB-värit HSV-arvoiksi intuitiivista värinmuokkausta
SHA-512 Hajautuslaskuri
Luo SHA-512-tiivisteitä nopeasti ja helposti