skewY-funksie

Die skewY-funksie spesifiseer 'n skeefheid van 'n element om die Y-as, wat dit in 'n parallelogram verander. Dit word saam met die transform-eienskap gebruik. Die waarde van die eienskap is 'n hoek in enige hoekeenhede. Die hoek kan positief of negatief wees. 'n Positiewe waarde skeef die element opwaarts, 'n negatiewe waarde afwaarts. Die skeefheid vind plaas om die punt wat deur die transform-origin-eienskap gespesifiseer word.

Sintaksis

cssselektor {
  transform: skewY(hoek);
}

Voorbeeld

In hierdie voorbeeld is die blok 30 grade opwaarts geskuins:

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

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

Результат:

Voorbeeld

In hierdie voorbeeld is die blok 30 grade afwaarts geskuins:

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

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

Результат:

Sien ook