Kazi ya translateY

Kazi translateY inabainisha usogezi wa kipengele kwenye mhimili Y. Inatumika pamoja na sifa transform. Thamani ya sifa ni vipimo vyovyote vya ukubwa. Thamani chanya husogeza chini, hasi - juu.

Kiufundi

csskichaguzi {
  transform: translateY(usogezi);
}

Mfano

Ukikasha kipofu kwenye kipengele - kitasogea kwa 30px chini:

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

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: translateY(30px);
}

Результат:

Mfano

Ukikasha kipofu kwenye kipengele - kitasogea kwa 30px juu:

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

css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: translateY(-30px);
}

Результат:

Angalia pia