Style backgroundPosition အကိုးအခံ

အသုံးပြုနည်း နှင့် ကြည့်ချင်း

backgroundPosition အကိုးအခံ နှင့် အရာတွင် နောက်ပိုင်းအရာကို စတင်ဆုတ်ယိုက်ရန်。

အခြားလျှပ်ချဲ့များ:

HTML အော်ခြံ:background အကိုးအခံ

CSS ဖိတ်ချုပ်:CSS နောက်ခံ

CSS3 ဖိတ်ချုပ်:CSS3 နောက်ခြမ်း

CSS လက်မှတ်ချုပ်:background-image အကိုးအခံ

CSS လက်မှတ်ချုပ်:background-position အကိုးအခံ

အကျိုးသတ္တု

အမှတ် 1

နောက်ပိုင်းအရာကို ပြောင်းလဲရန်:

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

ကိုယ်တိုင် ကျယ်ပြန်ချင်း ကျင်းပပါ

အမှတ် 2

ပြည်ထောင်ပိုင်း <div> အရာတွင် နောက်ပိုင်းကို စတင်ဆုတ်ယိုက်ရန်:

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

ကိုယ်တိုင် ကျယ်ပြန်ချင်း ကျင်းပပါ

အမှတ် 3

<div> အကျုံး တွင် backgroundImage အခြေအနေ ကို လေးလံ 200 ပမာဏ နှင့် အမြင့် 40 ပမာဏ အား ပြန်လည်ပေးပါ:

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

ကိုယ်တိုင် ကျယ်ပြန်ချင်း ကျင်းပပါ

အမှတ် 4

backgroundImage အခြေအနေ ကို ပြန်လည်ပေးပါ <div> အကျုံး တွင်:

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

ကိုယ်တိုင် ကျယ်ပြန်ချင်း ကျင်းပပါ

အက္ခရာ

backgroundPosition အကျုံ� ကို ပြန်လည်ပေးပါ:

object.style.backgroundPosition

backgroundPosition အကျုံး ကို အသုံးပြုပါ:

object.style.backgroundPosition = value

အကျုံး လျှပ်ချက်

လျှပ်ချက် ဖော်ပြ
  • top left
  • top center
  • top right
  • center left
  • center center
  • center right
  • bottom left
  • bottom center
  • bottom right
 သင် အကျုံး သာ အသုံးပြု လျှင် တခုခု အကျုံး က "center" ဖြစ်ပါသည်
x% y%

x အကျုံး က လေးလံ အခြေအနေ ကို ကိုးကွယ်ပါ။ y အကျုံး က အမြင့် အခြေအနေ ကို ကိုးကွယ်ပါ

အရှေ့မြောက်ကွေ့ က 0% 0% ဖြစ်ပါသည်။ အတော်လေးမြောက် အတော်လေးမြောက် က 100% 100% ဖြစ်ပါသည်

သင် တစ် အကျုံး သာ အသုံးပြု လျှင် တခုခု အကျုံး က 50% ဖြစ်ပါသည်
xpos ypos

x အကျုံး က လေးလံ အခြေအနေ ကို ကိုးကွယ်ပါ။ y အကျုံး က အမြင့် အခြေအနေ ကို ကိုးကွယ်ပါ

အရှေ့မြောက်ကွေ့ က 0 0 ဖြစ်ပါသည်။ အကျုံး ကို ပမာဏ (0px 0px) သို့မဟုတ် အခြား ဆိုင်းကျမ်း CSS အကျုံး ကို အသုံးပြုပါ

သင် တစ် လျှပ်ချက် သာ အသုံးပြု လျှင် တခုခု လျှပ်ချက် က 50% ဖြစ်ပါသည်။ % နှင့် အခြား အသုံးပြုနိုင်သော အကျုံး ကို ပေါင်းစပ် အသုံးပြုပါ
initial အကျုံး ကို မူကြမ်း လျှပ်ချက် ကို အသုံးပြုပါ။ ကျမ်းကို ကြည့်ရမည် initial。
inherit အဖွဲ့အစည်း ဖြစ်သော အသုံးပြု ပြီး အသုံးပြုထားသော အကျုံး ကို ထိန်းချုပ်ပါ။ ကျမ်းကို ကြည့်ရမည် inherit。

နည်းပါးဆိုင်းကျမ်း

မူကြမ်း လျှပ်ချက်: 0% 0%
လျှပ်ချက်: ကြောင်းချက် ကို ဖော်ပြထားသော စကာတင် ပုံစံ
CSS ပုံစံ: CSS1

ဘရောက်သုတ် ထောက်ပံ့

backgroundPosition ဖြစ်ပါတယ် ဆိုင်းကျမ်း CSS1 (1996) အခြေခံအရာ

အားလုံး ဘရောက်သုတ် အား အပြောင်းအလဲမရှိ ထောက်ပံ့ပါသည်:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
ထောက်ပံ့ ထောက်ပံ့ ထောက်ပံ့ ထောက်ပံ့ ထောက်ပံ့ ထောက်ပံ့