[ CSS ] Mengenal background position di CSS

Advertisement

Apa sebenarnya fungsi dari background-position ? apa saja property yang ada di background-position ? itu semua akan dikupas dengan jelas di artikel yang indonesiakode bagikan ini .

Fungsi dari background-position ?

background-position berfungsi sebagai pengarah posisi background-image seperti halnya text-aign pada css, kalau text-align bersifat untuk semua elemen tetapi tidak dengan attribut background:position justru mengarah pada background:image .

Berikut merupakan property pada background-position :

left top
left center
left bottom
right top

Advertisement

right center
right bottom
center top
center center
center bottom

Anda juga bisa menambahkan value propertynya hanya satu seperti center,left dan right dan sesuaikan dengan keinginan anda .

Advertisement

Bagaimana cara penggunaan background-position ??

Caranya pun sangatlah mudah dan pastikan ada background-image yang dimana akan memuat suatu objek / gambar yang nanti akan di atur arah posisi objeknya, berikut contoh kodenya :

.indonesiakode{
background-image:url(/img/indonesiakode.png);
background-position:value;
}

Pada value isikan dengan property pada background-position,
Contoh :

background-position : center center;

Itulah pengertian dan sekaligus contoh mengenai background-position, silahkan diterapkan pada skrip html dan css anda dan baca artikel lainya untuk menambah wawasan anda .

Semoga bermanfaat .

Indonesiakode,

Advertisement