bottom ဂုဏ်သတ္တိ

bottom ဂုဏ်သတ္တိသည် element ၏အောက်ဆုံးအစွန်း၏တည်နေရာကိုသတ်မှတ်ပေးသည်။ ဂုဏ်သတ္တိအတွက်တန်ဖိုးများကိုယေဘုယျအသိအမှတ်ပြုအတိုင်းအတာယူနစ်များ၊ ဥပမာ- ပစ်ဆယ်များ၊ လက်မများ၊ ပွိုင့်များ၊ ရာခိုင်နှုန်းများဖြင့်ရေးသားနိုင်သည်။ သတ်မှတ်ထားသောတန်ဖိုးများသည်အနှုတ်ကိန်းများလည်းဖြစ်နိုင်ပြီး၊ ထိုသို့ဆိုလျှင် element များသည်တစ်ခုပေါ်တစ်ခုထပ်နေလိမ့်မည်။ ကိုဩဒိနိတ်များရေတွက်မှုကို position ဂုဏ်သတ္တိကဆုံးဖြတ်ပေးသည်၊ ၎င်းသည်ပုံမှန်အားဖြင့် relative (အနေအထားဆိုင်ရာ) သို့မဟုတ် absolute (အနေအထားအပြည့်အစုံ) တန်ဖိုးများကိုယူသည်။

သဒ္ဒါဖွဲ့စည်းပုံ

cssselector {
  bottom: auto သို့မဟုတ် တိုင်းတာမှုယူနစ်ပါသောကိန်း;
}

နမူနာ

Child element အပေါ်မှာတင်ထားသောအခါ ၎င်း၏အောက်ဆုံးနယ်နမ်တည်နေရာကို 25px နှင့်ညီအောင်သတ်မှတ်ကြပါစို့။

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

css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-top: 50px;
}
p:hover {
  bottom: 25px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

နမူနာ

ယခု child element ၏အောက်ဆုံးနယ်နမ်သည် တင်ထားသောအခါ -50px တွင်တည်ရှိပါစေ။

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

css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-top: 50px;
}
p:hover {
  bottom: -50px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

ဆက်လက်လေ့လာရန်