marslı
23-01-2008, 01:54 AM
background-attachment
Kullanılan zemin resminin sayfa kaydırıldığında sayfa elemanı ile birlikte kaydırılması veya sabit kalmasını denetler. İki değer alabilir scroll arkaplanın sayfa ile birlikte kaydırılmasını sağlar. Bu değer vardayılan değerdir, fixed arkaplan resminin sayfa kaydırılsa bile yerinde kalmasını sağlar. Bu özellik kullanıldığında sayfa içeriği arkaplan resmi üzerinden kayarak hareket eder.
<DIV STYLE="background-image:url(zemin.jpg);
background-attachment:scroll;">
Bu alanda kullanılan zemin resmi kayabilir.
</DIV>
Bu örneğin sonucu aşağıdadır.
Bu alanda kullanılan zemin resmi kayabilir.
background-position
Kullanılan arkaplan resminin konumunu belirler. Bu sayede resmi sayfanın/elemanın istenilen bölümüne yerleştirebiliriz. Kullanımı :
background-position : dikeydeğer yataydeğer
Burada yatay değer yerinde soldan sağa doğru resmin nereye konulacağı, dikey değer yerinde ise üsten alta doğru resmin nereye konulacağını belirtilir. Kullanılacak değerler üç şekilde olabilir.
1. Değer girmek, bu şekilde kullanımda direkt pixel olarak dikey ve yatay değer verilebilir.
2. Yüzdelik değer, yukarıdaki gibi bir değer verilir. Fakat bu değer orantısaldır ve browser penceresinin büyüklüğüne göre istenilen oranda ayarlama yapılır. Değer verilirken yüzdelik değer olduğunu değerin sonuna yüzde ( % ) işareti koyarak belirtilir.
3. Tanımlı kelimeleri kullanmak; burada dikey olara resmin en üsten başlaması için top, ortalanması için center ve en alta yerlerştirilmesi için bottom değerleri kullanılabilir. Yine yatay olarak resmin solda başlaması için left, sağa dayalı olması için right ver ortalanması içincenter değerleri alabilir.
Örnek kullanım şekilleri şöyle olabilir :
P { background-image:url(zemin.jpg); background-position: center right;}
DIV { background-image:url(zemin.gif); background-position: 30 150;}
BODY { background-image:url(zemin.gif); background-position: 10% 20%;}
background
Arkaplan resminin yerleştirilmesi için kısa bir tanımlamanın kullanılmasını sağlar. Resmin adı, yatay ve dikey konumu, sabit olup olmayacağı gibi özelliklerin tamamı veya bir kısmı bu özellik içerisinde kullanılabilir. Eksik özellik girildiğinde varsayılan değerler kullanılır. Örnek kullanımı :
P { background : url(zemin.gif) top left;}
BODY { background : url(zemin.jpg) 39 45 fixed;}
.not { background : url(resim.gif) 10% 20%;}
Kullanılan zemin resminin sayfa kaydırıldığında sayfa elemanı ile birlikte kaydırılması veya sabit kalmasını denetler. İki değer alabilir scroll arkaplanın sayfa ile birlikte kaydırılmasını sağlar. Bu değer vardayılan değerdir, fixed arkaplan resminin sayfa kaydırılsa bile yerinde kalmasını sağlar. Bu özellik kullanıldığında sayfa içeriği arkaplan resmi üzerinden kayarak hareket eder.
<DIV STYLE="background-image:url(zemin.jpg);
background-attachment:scroll;">
Bu alanda kullanılan zemin resmi kayabilir.
</DIV>
Bu örneğin sonucu aşağıdadır.
Bu alanda kullanılan zemin resmi kayabilir.
background-position
Kullanılan arkaplan resminin konumunu belirler. Bu sayede resmi sayfanın/elemanın istenilen bölümüne yerleştirebiliriz. Kullanımı :
background-position : dikeydeğer yataydeğer
Burada yatay değer yerinde soldan sağa doğru resmin nereye konulacağı, dikey değer yerinde ise üsten alta doğru resmin nereye konulacağını belirtilir. Kullanılacak değerler üç şekilde olabilir.
1. Değer girmek, bu şekilde kullanımda direkt pixel olarak dikey ve yatay değer verilebilir.
2. Yüzdelik değer, yukarıdaki gibi bir değer verilir. Fakat bu değer orantısaldır ve browser penceresinin büyüklüğüne göre istenilen oranda ayarlama yapılır. Değer verilirken yüzdelik değer olduğunu değerin sonuna yüzde ( % ) işareti koyarak belirtilir.
3. Tanımlı kelimeleri kullanmak; burada dikey olara resmin en üsten başlaması için top, ortalanması için center ve en alta yerlerştirilmesi için bottom değerleri kullanılabilir. Yine yatay olarak resmin solda başlaması için left, sağa dayalı olması için right ver ortalanması içincenter değerleri alabilir.
Örnek kullanım şekilleri şöyle olabilir :
P { background-image:url(zemin.jpg); background-position: center right;}
DIV { background-image:url(zemin.gif); background-position: 30 150;}
BODY { background-image:url(zemin.gif); background-position: 10% 20%;}
background
Arkaplan resminin yerleştirilmesi için kısa bir tanımlamanın kullanılmasını sağlar. Resmin adı, yatay ve dikey konumu, sabit olup olmayacağı gibi özelliklerin tamamı veya bir kısmı bu özellik içerisinde kullanılabilir. Eksik özellik girildiğinde varsayılan değerler kullanılır. Örnek kullanımı :
P { background : url(zemin.gif) top left;}
BODY { background : url(zemin.jpg) 39 45 fixed;}
.not { background : url(resim.gif) 10% 20%;}