myNotlar Logo

bottom


Internet Explorer 5 Firefox 1 Opera 6

bottom özelliği, style.position özelliği absolute veya fixed olarak ayarlanıp rastgele yerleştirilebilen elementlerin alt kenarı ile pencerenin görünen alanının alt kenarı arasındaki mesafeyi belirler.

DOM Sözdizimi

element.style.bottom = "yerlesim"

CSS Sözdizimi

bottom: yerlesim
yerlesimAşağıdaki değerlerden birini alabilir.
  • auto : Elementin alttan uzaklığı otomatik belirlenir.
  • Yüzde değer : Element içinde bulunduğu bloğun yüksekliğine göre hesaplanarak yerleştirilir.
  • CSS Uzunluk ölçüsü birimlerinden birini alabilir. Bunlar, em, ex, px, in, cm, mm, pt veya pc tiplerinden biri ile tam veya kayar noktalı bir tam sayıdır.

Aşağıdaki örnek, style.position özelliği absolute olarak belirtilen bir div elementinin top, right, bottom ve left özellikleri kullanılarak ekranının dört köşesine yerleştirilmesini göstermektedir.

<script type="text/javascript">
function yerlestir(ust, sag, alt, sol)
{
    var div = document.getElementById("ornekDiv");

    div.style.position = "absolute";

    div.style.top = ust;
    div.style.right = sag;
    div.style.bottom = alt;
    div.style.left = sol;
}
</script>

<style type="text/css">
#ornekDiv {     
    width:150px;
    color:white;
    background-color:green;
}
#ornekDiv p
{
    text-align:center;
    font-weight:bold;
}
#ornekDiv input
{
    width:68px;
    margin:2px;
}
</style>

<div id="ornekDiv"><p>Örnek Div</p>
<input type="button" value="Üst-Sol" onClick="yerlestir('0px', 'auto', 'auto', '0px')" />
<input type="button" value="Üst-Sağ" onClick="yerlestir('0px', '0px', 'auto', 'auto')" /><br/>
<input type="button" value="Alt-Sol" onClick="yerlestir('auto', 'auto', '0px', '0px')" />
<input type="button" value="Alt-Sağ" onClick="yerlestir('auto', '0px', '0px', 'auto')" />
                                                       // Üst    Sağ    Alt    Sol
</div>
Test Edin

Örnek Div


İlgili Başlıklar
 
myNotlar Hakkında
Telif Hakkı © 2007-2009 mynotlar.com Tüm Hakları Saklıdır. Kopyalanamaz. Yayınlanamaz.
E-Posta : support@myNotlar.com

| Tek Kişilik Oyunlar | Sudoku | Oyunlar |