VISSZA
MENÜ
TOVÁBBA CSS3 lehetővé teszi a HTML elemek átméretezését (skálázását) x, y vagy z irányba a transform tulajdonság segítségével.
A scaleY() függvénnyel függőlegesen nyújthatjuk vagy zsugoríthatjuk a HTML elemet.
Vízszintes skálázás beállítása:
kijelölő
{
transform
:
scaleY(érték);
}
1. Példa:
Forráskód
<style>
.tarolo {
….
position: relative; }
.elem {
...
position: absolute; }
#scaleY_1 .elem {
-webkit-transform: scaleY( 0.8 );
-moz-transform: scaleY( 0.8 );
-o-transform: scaleY( 0.8 );
transform: scaleY( 0.8 );
}
#scaleY_2 .elem {
-webkit-transform: scaleY( 1.2 );
-moz-transform: scaleY( 1.2 );
-o-transform: scaleY( 1.2 );
transform: scaleY( 1.2 );
}
</style>
...
<body>
<div id="scaleY_1" class="tarolo">
<div class="elem"> scaleY( 0.8 )</div>
</div>
<div id="scaleY_2" class="tarolo">
<div class="elem"> scaleY( 1.2 ) </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_scaleY_01.html