logó WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS
Ingyenes elektronikus tananyag interaktív weboldalak készítéséhez.
visszaVISSZA   
menüMENÜ   

Függőleges döntés



A CSS3 lehetővé teszi a HTML elemek megdöntését (ferdíthetését) Y irányba a transform tulajdonság segítségével.

A skewY() függvénnyel adhatjuk meg a megdöntés szögét, az Y tengely mentén deg-ben.

A függőleges döntés beállítása:

kijelölő
{
transform
:
skewY(értékdeg);
}


1. Példa:

Forráskód



<style>
    .tarolo {
     ….
      position: relative; }
 
.elem { ... position: absolute; } #skewY_1 .elem { -webkit-transform: skewY( 20deg ); -moz-transform: skewY( 20deg ); -o-transform: skewY( 20deg ); transform: skewY( 20deg ); } #skewY_2 .elem { -webkit-transform: skewY( -20deg ); -moz-transform: skewY( -20deg ); -o-transform: skewY( -20deg ); transform: skewY( -20deg ); } </style> ... <body> <div id="skewY_1" class="tarolo"> <div class="elem"> skewY( 20deg )</div> </div> <div id="skewY_2" class="tarolo"> <div class="elem"> skewY( -20deg ) </div> </div> </body>

Eredmény*


* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css3_skewY_01.html


Ahogy a legtöbb honlap, ez a webhely is használ sütiket a weboldalain.