Sifa transition

Sifa transition ni kifupi cha mabadiliko laini, inaruhusu wakati mmoja kuweka transition-duration, transition-property, transition-timing-function na transition-delay.

Kiendesi

csskichagua {
  transition: thamani;
}

Mpangilio wa sifa haina maana, hata hivyo muda wa utekelezaji (transition-duration) lazimo iwe mbele ya ucheleweshaji (transition-delay).

Thamani

Tazama sifa zinazofanana. Thamani ya msingi: all 0s ease 0s.

Thamani none inabatilisha mabadiliko yote (yatatokea mara moja).

Mfano

Leta kielekezi juu ya kishazi - 3 sekunde hakuna kitatokea (kuna ucheleweshaji wa 3s), kisha kitabadilisha upana wake kwa laini kwa 2 sekunde. Ukiondoa kielekezi - tena 3 sekunde hakuna kitatokea, kisha upana utapungua kwa laini hadi thamani ya asili:

html<div id="elem"></div>

css#elem {
  border: 1px solid black;
  transition: width 2s ease 3s;
  width: 100px;
  height: 50px;
}
#elem:hover {
  width: 400px;
}

Результат:

Angalia pia