padding ဂုဏ်သတ္တိ

padding ဂုဏ်သတ္တိသည် အချက်၏ အတွင်း အကွာအဝေးကို သတ်မှတ်ပေးသည်။ ဂုဏ်သတ္တိ၏ တန်ဖိုးသည် မည်သည့် အရွယ်အစား ယူနစ်များမဆို ဖြစ်နိုင်သည်။ စံထားချက်အရ browser တိုင်းသည် အချက်များကို မတူညီသော အကွာအဝေးများ ထည့်ပေးနိုင်သည်။ ဂုဏ်သတ္တိသည် padding-top, padding-right, padding-bottom, padding-left စသည့် ဂုဏ်သတ္တိများအတွက် အတိုကောက်ဖြစ်သည်။

ဖွဲ့စည်းပုံ

cssselector {
  padding: တန်ဖိုး;
}

ပါရာမီတာ အရေအတွက်

padding ဂုဏ်သတ္တိသည် 1, 2, 3 သို့မဟုတ် 4 တန်ဖိုးများကို လက်ခံပြီး ကြားခံနေရာဖြင့် စာရင်းပြုစုထားသည်။

နမူနာ

ဤကိစ္စတွင် စံထားချက်အရ အတွင်းအကွာအဝေးသည် သုညဖြစ်နေပြီး စာသားသည် ဘလောက်၏ နယ်နိမိတ်သို့ ကပ်နေမည်။

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 0;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

နမူနာ

ယခု အတွင်းအကွာအဝေးကို 30px အတိုင်း ပြုလုပ်ကြည့်ကြပါစို့။

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 30px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

နမူနာ

ယခု အပေါ်နှင့်အောက် အကွာအဝေးသည် 20px ဖြစ်ပြီး၊ ညာဘက်နှင့်ဘယ်ဘက် အကွာအဝေးသည် 5px ဖြစ်မည်။

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 20px 5px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

နမူနာ

ယခု အပေါ်ဘက် အကွာအဝေး 5px, ညာဘက် - 15px, အောက်ဘက် - 25px, ဘယ်ဘက် - 35px ဖြစ်မည်။

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 5px 15px 25px 35px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

ဒါ့အပြင်ကြည့်ပါ