CSS skew() -funktio

Määrittely ja käyttö

CSS:ssä skew() Käytetään elementin kaltevuuden määrittämiseen annetun kulman suuntaan x- ja y-akseleilla.

skew() Funktio transform Käytetään ominaisuudessa.

Esimerkki

Esimerkki 1

Käyttö skew() Kaltevuus useille <div>-elementeille:

#myDiv1 {
  transform: skew(15deg);
}
#myDiv2 {
  transform: skew(15deg, 15deg);
}
#myDiv3 {
  transform: skew(-15deg);
}

Kokeile itse

Esimerkki 2

Käyttö skew() Kaltevuuskuva:

#img1 {
  transform: skew(25deg);
}
#img2 {
  transform: skew(-25deg);
}
#img3 {
  transform: skew(10deg, 10deg);
}

Kokeile itse

CSS-grammatiikka

skew(ax, ay)
Arvo Kuvaus
ax Välttämätön. Aste. Määrittää kaltevuuden x-akselin suuntaan.
ay Valinnainen. Aste. Määrittää kaltevuuden y-akselin suuntaan. Jos jätetään pois, arvo asetetaan 0.

Tekninen yksityiskohta

Versio: CSS Transforms Module Level 1

Selaimen tuki

Taulukon numerot ilmaisevat ensimmäisen selaimen version, joka täysin tukee tätä toimintoa.

Chrome Edge Firefox Safari Opera
1 12 3.5 3.1 10.5

Liittyvät sivut

Oppitunti:CSS 2D muunnos

Viittaus:CSS transform ominaisuus

Viittaus:CSS skewX() funktio

Viittaus:CSS skewY() funktio