Kurssiesimerkki:

CSS scaleY() -funktio

Määrittely ja käyttö scaleY() CSS:n

scaleY() Funktiota käytetään elementin pystysuuntaiseen skaalaamiseen.

scaleY() Funktiota käytetään elementin korkeuden lisäämiseen tai vähentämiseen. transform Ominaisuudessa käytettävä.

Esimerkki

Esimerkki 1

Käytä scaleY() Useiden <div>-elementtien korkeuden skaalaus:

#myDiv1 {
  transform: scaleY(0.5);
}
#myDiv2 {
  transform: scaleY(70%);
}
#myDiv3 {
  transform: scaleY(1.1);
}

Kokeile itse

Esimerkki 2

Käytä scaleY() Kuvan korkeuden skaalaus:

#img1 {
  transform: scaleY(0.5);
}
#img2 {
  transform: scaleY(70%);
}
#img3 {
  transform: scaleY(-0.5);
}
#img4 {
  transform: scaleY(1.1);
}

Kokeile itse

CSS-kieli

scaleY(s)
Arvo Kuvaus
s Välttämätön. Määritä korkeuden skaalauksen vektorin numero.

Tekninen yksityiskohta

Versio: CSS Transforms Module Level 1

Selaimen tuki

Taulukossa olevat numerot viittaavat ensimmäiseen selaimen versioon, joka täysin tukee tätä toimintoa.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Liittyvät sivut

Oppimispaketti:CSS 2D muunnos

Viittaus:CSS transform ominaisuus

Viittaus:CSS scale ominaisuus

Viittaus:CSS scale() funktio

Viittaus:CSS scale3d() funktio

Viittaus:CSS scaleX() funktio