CSS3 outline-offset özelliği

Author: Kaan, Posted: 2010-05-03 00:39 GMT.

CSS3 outline-offset ?zelli?i

CSS3 ile gelen yeniliklerden biri de outline-offset ?zelli?i.. Outline ile olu?turulan ?er?eve, outline-offset ?zelli?ine verdi?imiz de?er ile merkezden uzakla??yor veya merkeze yakla??yor. (De?er, negatif olursa merkeze yakla??yor, pozitif olursa merkezden uzakla??yor.)

Bu ?zellik Opera, Firefox, Safari gibi taray?c?larda ?al???yor. ?imdi bir ?rnek yaparak konuyu daha iyi anlamaya ?al??al?m.

tml]<div id="outline">

<p>Burada outline ile mavi ?er?eveyi olu?turup, outline-offset ?zelli?i ile de bu ?er?eveyi d??a do?ru orant?l? bir ?ekilde geni?lettik.</p>

</div>

ss]#outline {

width: 150px;

height: 150px;

margin:30px;

text-align:center;

border: 1px solid black;

outline: 1px solid blue;/*burada ikinci ?er?eveyi olu?turduk*/

outline-offset: 10px;/*bununla da d??a do?ru 10 piksel geni?lettik*/

}

Kaynak dosyay? buradan indirebilirsiniz.