Jika background image telah ditentukan, property background-position ini menentukan posisi awal mereka (setelah pengubahan ukuran) dalam area pemosisian latar belakang yang sesuai.
Property background-position mengambil satu atau lebih nilai <posisi> yang dipisah koma. Jika beberapa gambar latar belakang telah ditentukan, masing-masing <posisi> diterapkan ke gambar latar belakang yang sesuai (<posisi> pertama untuk gambar pertama, <posisi> kedua untuk gambar kedua, dan seterusnya).
Penulisan Syntax:
background-position: <position> [ , <position> ]*
Values:
<position>
Menentukan posisi elemen di dalam area pemosisian latar belakang.
<posisi> dapat didefinisikan dengan menggunakan kata kunci ofset (atas, kiri, bawah, kanan, dan tengah), atau nilai offset <percentage> dan <length> relatif.
Nilai-nilai ini menggambarkan posisi elemen relatif terhadap tepi wadahnya (tepi atas dan tepi kiri).
Contoh:
Contoh-contoh berikut ini adalah semua posisi valid yang ditetapkan pada gambar latar belakang suatu elemen:
background-position: 20px; background-position: 20px 50px; background-position: 30% 75%; background-position: top left; background-position: top 100px; background-position: -300px 45px; /* 300px to the left and 45px downwards */
Contoh berikut menentukan posisi dua gambar latar belakang yang diterapkan pada suatu elemen.
.element {
background-image: url(path/to/first/image.jpg), url(path/to/second/image.png);
background-position: top left, 75% 80%;
}