CSS3 átmeneti generátor

Sima átlátszatlansági átmenet

Népszerű előbeállítások

Elhalványulási hatás

Sima átlátszatlansági átmenet

Méretezési hatás

Elem átméretezése az egérrel

Forgatási effektus

Elem elforgatása az egérrel való lebegés közben

Dia effektus

Elem pozíciójának áthelyezése

Színváltozás

Háttérszín átmenet

Az átmenetekről

A CSS-átmenetek lehetővé teszik a tulajdonságértékek zökkenőmentes módosítását egy adott időtartam alatt.

A gyakori animált tulajdonságok a következők:

  • szélesség, magasság
  • margó, párnázás
  • átlátszatlanság, szín
  • transform (scale, rotate, translate)
  • background-color

Profi tipp: Használja az "Összes tulajdonság" opciót az összes módosítás animálásához.

Preview

HOVER ME

Generált kód

.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; }  .element:hover { /* Hover styles will be generated here */ }

Átmeneti vezérlők

300
0

Lebegő effektusok

100%
100%
0px
0px
8px
8px

Related Tools