Css Ile Arkaplan resim ekleme komutlari-cahitsoyman.blogspot.com
Bu makalede bir web sitesi tasarımı yaparken CSS ile divlerimize arkaplan resimlerimizi nasıl vereceğimizi, sabit veya  tekraralanan arkaplan resimlerimizi nasıl yerleştireceğimizi anlatmaya çalışacağım.

Background-image Komutu: 
Bir dive background image vereceğimizde resmin boyutunun mümkün olduğunca küçük seçmemiz gerekmektedir. Böylece resmin boyutu azaltılarak sitenin performasının artması sağlanacaktır. Diğer bir deyişle; 30-40 kb.lik bir resim yerine (1px x100px ölçüsünde ) 1 kb.lik bir resim ile aynı işi yapmış oluruz. 
Ayrıca, background olarak kullanacağımız  resminizi png yerine jpg uzatılı yaparsak boyutu küçülterek sitemizin performansını artırmış oluruz.  
Background-image komutunu resmimizin yolunu yazarak veya gözat butonuyla resmimizi seçerek verebiliriz.


Background-color Komutu: 
Bir dive düz bir background vermek istediğimizde bu komutu kullanırız. Renk kodunun başına "#" işareti kullanabildiğimiz gibi renk seçim aracıyla da istediğimiz rengi seçebiliriz.

Background-repeat Komutu: 
Ekleyeceğimiz resmin tekrarlanıp tekrarlanmayacğını belirtmek için kullanılır. Resmin bir defa tekrarlanacağını belirtmek için ise  "no repeat" komutu veririz. 

Background-position (y) Komutu:
Ekleyeceğimiz resmin aşağı, yukarı ya da dikey ortalı olarak hizalanmasını sağlar. Resmimizin başlayacağı yeri belirtir. Eğer rakamsal bir değerle belirtirsek üst taraftan belirtilen rakam kadar boşluk bırakarak resmimizi yerleştirecektir.

Background-position (x) Komutu: 
Ekleyeceğimiz resmin sağa, sola ya da ortalı olarak hizalanmasını sağlar. Eğer rakamsal bir değerle belirtirsek sol taraftan belirtilen rakam kadar boşluk bırakarak resmimizi yerleştirecektir.
Aşağıdaki seçeneklerle kullanılır:

top left – üst sol
top center – üst orta
top right – üst sağ
center left – orta sol
center center – ekranın ortası (hem üstten hem yandan)
center right – orta sağ
bottom left – alt sol
bottom center – alt orta
bottom right – alt sağ
x-% y-% – yüzde olarak sağ/sol ve üst/alt
x-pos y-pos – x,y koordinatlarına göre
Background-attachment Komutu: 
Bir div nesnemizi aşağı doğru kaydırdığımızda içinde ki yazıların hareket etmesine rağmen arkaplan resminin sabit kalması için kullanılır. Resmin arkaplan resmi ile birlikte hareket etmesi için "scroll" komutu, resmin sabit kalması için "fixed" komutu ile kullanılır. 

Örnek Komutlar:

background-image: url(resimler/arkaplan.jpg);
background-color: #ffffff;
background-repeat: repeat;
background-attachment: scroll;
background-color: white;
background-position: top-left;
background-repeat: no-repeat;
background-repeat: repeat-y;
background-repeat: repeat-x;