Style backgroundPosition özelliği

Tanım ve Kullanım

backgroundPosition Arka plan görselinin element içindeki konumunu ayarlamak veya döndürmek için özellik.

Ayrıca bakınız:

HTML Stili:background özelliği

CSS Eğitim Seti:CSS Arka Plan

CSS3 Eğitim Seti:CSS3 Arka Plan

CSS Referans Kılavuzu:background-image özelliği

CSS Referans Kılavuzu:background-position özelliği

Örnek

Örnek 1

Arka plan görseli konumunu değiştirin:

document.body.style.backgroundPosition = "top right";

şahsen deneyin

Örnek 2

Div element'in arka plan görseli konumunu altta ortada olarak değiştirin:

document.getElementById("myDiv").style.backgroundPosition = "center bottom";

şahsen deneyin

örnek 3

<div> elementindeki arka plan resminin konumunu yatay 200 piksel ve dikey 40 piksel olarak değiştirin:

document.getElementById("myDiv").style.backgroundPosition = "200px 40px";

şahsen deneyin

örnek 4

<div> elementindeki arka plan resminin konumunu döndürün:

document.getElementById("myDiv").style.backgroundPosition; 

şahsen deneyin

gramer

backgroundPosition özelliğini döndürün:

nesne.style.backgroundPosition

backgroundPosition özelliğini ayarlayın:

nesne.style.backgroundPosition = value

özellik değeri

değer tanım
  • üst sol
  • üst ortası
  • üst sağ
  • ortası sol
  • ortası ortası
  • ortası sağ
  • sol alt köşe
  • alt ortası
  • sağ alt köşe
sadece bir anahtar kelime belirtirseniz, diğer değeri "merkez" olacaktır.
x% y%

x değeri yatay konumu, y değeri dikey konumu belirtir.

sol üst köşe 0% 0'dır. Sağ alt köşe 100% 100'dür.

sadece bir değer belirtirseniz, diğer değeri %50'dir.

xpos ypos

x değeri yatay konumu, y değeri dikey konumu belirtir.

sol üst köşe 0 0'dır. Birimler piksel (0px 0px) veya herhangi bir diğer CSS birimi olabilir.

sadece bir değer belirtirseniz, diğer değeri %50'dir. % ve birimleri karışık kullanabilirsiniz.

initial bu özelliği varsayılan değerine ayarlayın. Bakınız initial.
inherit bu özelliği ebeveyn elemanından miras alır. Bakınız inherit.

teknik ayrıntılar

varsayılan değer: 0% 0%
dönüş değeri: dizge, arka plan resminin konumunu belirtir.
CSS sürümü: CSS1

tarayıcı desteği

backgroundPosition CSS1 (1996) özelliğidir.

tüm tarayıcılar tamamen onu destekler:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
destekler destekler destekler destekler destekler destekler