ဂုဏ်သတ္တိ background-position-x

background-position-x ဂုဏ်သတ္တိသည် အရာ၏ နောက်ခံပုံ၏ မိမိအလျားလိုက် အနေအထားကို သတ်မှတ်ပေးသည်။

ဂုဏ်သတ္တိသည် အောက်ပါတန်ဖိုးများကို လက်ခံနိုင်သည်။ left, center, right နှင့် ထို့အပြင် နောက်ခံ၏အနေအထားကို ရာခိုင်နှုန်း သို့မဟုတ် ပစ်ဆယ်များဖြင့် သတ်မှတ်နိုင်သည်။

စာကြောင်းဖွဲ့စည်းပုံ

cssရွေးချယ်သူ {
  background-position-x: တန်ဖိုး;
}

ဥပမာ

နောက်ခံပုံကို မိမိအလျားလိုက် ဘယ်ဘက်တွင် နေရာချကြပါစို့။

html<div id="elem"></div>

css#elem {
  background-position-x: left;
  background-image: url("bg.png");
  background-repeat: no-repeat;
  width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

ဥပမာ

ယခု နောက်ခံကို ညာဘက်သို့ ရွှေ့ကြပါစို့။

html<div id="elem"></div>

css#elem {
  background-position-x: right;
  background-image: url("bg.png");
  background-repeat: no-repeat;
  width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

ဥပမာ

နောက်ခံပုံကို အလယ်ဗဟိုတွင် နေရာချကြပါစို့။

html<div id="elem"></div>

css#elem {
  background-position-x: center;
  background-image: url("bg.png");
  background-repeat: no-repeat;
  width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

ဥပမာ

ယခု နောက်ခံအတွက် အနေအထားကို ရာခိုင်နှုန်းဖြင့် သတ်မှတ်ကြပါစို့။

html<div id="elem"></div>

css#elem {
  background-position-x: 20%;
  background-image: url("bg.png");
  background-repeat: no-repeat;
  width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

ဤသည်ကိုလည်း ကြည့်ပါ