Dalam perancangan desain sebuah website, background (latar belakang) adalah bagian penting yang membangun sebuah website. Background memberikan efek dan dekorasi visual terhadap sebuah elemen dengan begitu akan menimbulkan makna tertentu terkait dengan konten dari elemen tersebut. Penggunaan background juga penting dalam menentukan konsep dari sebuah website. Ada beberapa properti CSS yang berhubungan dengan pengaturan background, yaitu:

1. Background Color
Background Color digunakan untuk memberikan latar belakang berupa warna terhadap suatu elemen. Penambahan latar belakang warna juga dapat menggunakan properti 
background selain dari penggunaan properti background-color. Berikut adalah contoh penggunaan properti background-color:
background {
   background:red;
   background-color: red;
}
Pengisian jenis warna di properti background ataupun background-color dapat juga menggunakan kode heksa seperti #FFF, RGBA  seperti rgb(255, 0, 0), RGBA seperti rgba(255,0,0,1), HSL seperti hsl(0, 50, 100) atau HSLA seperti hsla(0,50,100,1).

 
2. Background Image 

Dengan menggunakan properti background image ataupun property background, kita dapat meletakkan gambar sebagai latar belakang sebuah elemen,sebagai contoh :
body {
background-image: url("lavender.jpg");
}
Tetapi secara default-nya, jika ukuran gambar lebih kecil dari ukuran elemennya maka akan terjadi perulangan gambar baik secara vertikal atau horizontal tergantung ukuran elemennya, sebagai contoh di mana ukuran image hanya 260 x 300px:

Hasil dari eksekusi kode diatas adalah :

Kita juga dapat mengatur perulangan dari gambar tersebut dengan menggunakan properti background-repeat yang berisi repeat, no-repeat, repeat-x dan repeat-y. Dimana repeat-x memberikan perulangan hanya pada sumbu x (horizontal), repeat-y memberikan perulangan hanya pada sumbu y (vertikal) dan no-repeat menghilangkan perulangan. Sebagai contohnya dari properti repeat-x adalah:

body {

background-image: url("codeigniter_logo.png");

background repeat: repeat-x;
}
Hasil dari eksekusi kodediatas adalah :

3. Background Postion
Dengan menggunakan properti background position maka kita dapat mengatur posisi dari background tersebut. Properti background position dapat diberi nilai dengan pixel ataupun persentase yang mengatur koordinat di sumbu-x dan sumbu-y. Berikut contoh penggunaan background-position:

body {
   background-image: url("codeigniter_logo.png");
   background-repeat: no-repeat;

   background-position: 100px 50px;
}

Hasil dari eksekusi kode diatas adalah :

4. Background-Shorthand properti
Untuk menulis seluruh gabungan dari properti CSS yang berhubungan dengan background, menggunakan sintaks yaitu:
background: color image position repeat;
Sebagai contoh dari penggunaan sintaks di atas, yaitu:
body {
   background: #FFF url("codeigniter_logo.png") no-repeat100px 50px;
}

(uli)