CSS translateY() -funktio

Määrittely ja käyttö

CSS:n translateY() Funktio mahdollistaa elementin siirtämisen y-akselin (pystysuuntaan) suuntaan.

translateY() funktio on transform ominaisuuksissa käytetään.

Esimerkki

Uudelleenaseta eri <div>-elementit pystysuuntaan:

#myDiv1 {
  transform: translateY(30px); /* Siirrä elementti y-akselin suuntaan 30px */
}
#myDiv2 {
  transform: translateY(50px); /* Siirrä elementti y-akselin suuntaan 50px */
}
#myDiv3 {
  transform: translateY(-10px); /* Siirrä elementti y-akselin suuntaan -10px */
}

Kokeile itse

CSS-grammatiikka

translateY(y)
Arvo Kuvaus
y Välttämätön. Määritä elementin siirtymä y-akselin suuntaan, joka voi olla luku tai prosentti.

Tekninen yksityiskohta

Versio: CSS Transforms Module Level 1

Selaimen tuki

Taulukossa olevat numerot ilmaisevat ensimmäisen selaimen version, joka täysin tukee tätä funktiota.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Liittyvät sivut

Ohje:CSS 2D muunnokset

Viittaukset:CSS transform ominaisuus

Viittaukset:CSS translate() funktio

Viittaukset:CSS translateX() funktio

Viittaukset:HTML DOM transform ominaisuus