Background-color:  Herhangi bir div nesnesinde düz bir arka plan rengi vermek istediğimizde "Background-color" özelliğini kullanırız. Burada istersek renk seçim aracını kullanarak istediğimiz bir rengi seçebilir, istersek de rengimizin kodunun başına "#" işareti koyarak yazabiliriz. Böylece istediğimiz renk tonunu bir çok yerde aynı şekilde kullanabiliriz.

Birbirine uyumlu renk seçimi yapmak için http://colorschemedesigner.com/ sitesini kullanabilirsiniz. Burada birbirine yakın ve zıt renklerin yakın tonlarını bulabilirsiniz.

Background-image: Div nesnelerimize resim olarak arka plan vermek için kullanılır. Burada istersek Gözat butonuna tıklayarak resmimizi  seçebilir, istersek de resmin yolunu yazarak belirtebiliriz.

Burada dikkat edilmesi gereken bir şey Google botları siteleri tararken her bir image (resim) dosyasını bir sorgu olarak algılayacaktır. Sitede çok fazla sorgu bulunursa Google'da üst sıralara çıkması zorlaşacaktır. Bu nedenle logo ya da iconlar gibi nesneleri background image olarak eklemek sitenin performansını arttıracaktır.

Bir div nesnesinde background-image vereceğimizde resmin boyutunun olabildiğince küçük yapılması gerekmektedir. Böylece sitenin boyutu azaltılarak performansın artmasını sağlanacaktır. Bunun için dikkat edeceğimiz 2 konu bulunmakta:

İlk olarak, renk geçişi (degrade) olan bir resmi genişliği 500px yüksekliği 100px olan bir div nesnesine atayacağımızda, hazırlayacağımız resmin 500*100 boyutunda olması gerekmez. Bunun yerine 1 px genişliğinde 100 px yüksekliğinde bir resim hazırlayıp, bu div'e arka plan olarak verirsek, resim yan yana dizilecek ve divin tamamını kaplayacaktır. Böylece 20 kb'lık bir resim yerine 1 kb'lık bir resim ile aynı işi yapmış olacağız.

Diğer dikkat edeceğimiz şey ise resmin türü olacaktır. Örneğin normal bir resim dosyasını arka plan olarak kullanacağımızda "jpg" yerine "png" türünü seçersek boyutu gereksiz yere büyütmüş oluruz. "png" sadece icon ya da logo gibi arka planın şeffaf olması gereken durumlarda kullanılır.

Background-repeat: Eklenen resmin tekrarlayıp tekrarlamayacağını belirlemek için kullanılır. "no-repeat" seçeneği eklenen resmin sadece 1 defa görünmesini sağlar. "repeat-x" resmin yatayda tekrarlamasını, "repeat-y" ise resmin dikeyde tekrarlamasını sağlar.

Background-position (x): Eklenen resmin sola, sağa ya da ortalı olarak hizalanmasını sağlar. Eğer bu kısma sayısal bir değer girersek, sol taraftan o kadar boşluk bırakarak resmi yerleştirecektir.

Background-position (y): Eklenen resmin yukarı, aşağı ya da dikey ortalı olarak hizalanmasını sağlar. Eğer bu kısma sayısal bir değer girersek, üst taraftan o kadar boşluk bırakarak resmi yerleştirecektir.

Background-attachment: Bir div nesnesini aşağı doğru kaydırdığımızda içindeki yazıların hareket etmesine rağmen arka plan resminin sabit kalması için kullanılır. "fixed" seçeneği ile resim sabit kalırken, "scroll" seçeneğinde arka plan resmi yazı ile beraber hareket edecektir.