border-width ဂုဏ်သတ္တိ

border-width ဂုဏ်သတ္တိသည် နယ်နိမိတ်မျဥ်းထူအရှည်ကို အားလုံးတစ်ချိန်တည်းတွင် သို့မဟုတ် တစ်ဖက်စီအတွက် သီးခြားစီ သတ်မှတ်ပေးသည်။ ၎င်းသည် border-left-width, border-bottom-width, border-top-width, border-bottom-width. ဂုဏ်သတ္တိများအတွက် အတိုကောက်ဂုဏ်သတ္တိဖြစ်သည်။

ဂုဏ်သတ္တိ၏တန်ဖိုးများအဖြစ် ရာခိုင်နှုန်းများမှလွဲ၍ မည်သည့် အရွယ်အစားယူနစ်များ မဆို ပါဝင်နိုင်သည်၊ သို့မဟုတ် သော့ချက်စကားလုံးများဖြစ်သော thin (2 ပစ်ဆယ်များတွင် နယ်နိမိတ်မျဥ်း), medium (4 ပစ်ဆယ်များတွင် နယ်နိမိတ်မျဥ်း) သို့မဟုတ် thick (6 ပစ်ဆယ်များတွင် နယ်နိမိတ်မျဥ်း)။ စံထားရာတန်ဖိုး: medium.

ဝါကျဖွဲ့ပုံ

selector {
	border-width: 1, 2, 3 သို့မဟုတ် 4 တန်ဖိုးများ;
}

တန်ဖိုးအရေအတွက်

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

အရေအတွက်	ဖော်ပြချက်
`1`	အားလုံးတစ်ချိန်တည်းအတွက် အမျိုးအစား။
`2`	ပထမတန်ဖိုးသည် အပေါ်နှင့် အောက်အတွက်၊ ဒုတိယတန်ဖိုးသည် ဘယ်နှင့် ညာနယ်နိမိတ်မျဥ်းများအတွက်။
`3`	ပထမတန်ဖိုးသည် အပေါ်အတွက်၊ ဒုတိယတန်ဖိုးသည် ဘယ်နှင့် ညာနယ်နိမိတ်မျဥ်းများအတွက်၊ တတိယတန်ဖိုးသည် အောက်အတွက်။
`4`	ပထမတန်ဖိုးသည် အပေါ်နယ်နိမိတ်မျဥ်းအတွက်၊ ဒုတိယတန်ဖိုးသည် ညာဘက်အတွက်၊ တတိယတန်ဖိုးသည် အောက်အတွက်၊ စတုတ္ထတန်ဖိုးသည် ဘယ်ဘက်နယ်နိမိတ်မျဥ်းအတွက်။

ဥပမာ

တစ်ပစ်ဆယ်ထူသော နယ်နိမိတ်မျဥ်းကို သတ်မှတ်ပါမည်:

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

#elem {
	border-width: 1px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

ဥပမာ

4 ပစ်ဆယ်ထူသော နယ်နိမိတ်မျဥ်းကို သတ်မှတ်ပါမည်:

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

#elem {
	border-width: 4px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

ဥပမာ

အပေါ်နှင့် အောက်နယ်နိမိတ်မျဥ်းထူအရှည်ကို 1px နှင့် ညာနှင့် ဘယ်ဘက်များကို 4px ဟူ၍ သတ်မှတ်ပါမည်:

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

#elem {
	border-width: 1px 4px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

ဥပမာ

အပေါ်နယ်နိမိတ်မျဥ်းထူအရှည်ကို 1px, ညာနှင့် ဘယ်ဘက်များကို 4px၊ အောက်ဘက်ကို 6px ဟူ၍ သတ်မှတ်ပါမည်:

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

#elem {
	border-width: 1px 4px 6px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

ဥပမာ

အပေါ်နယ်နိမိတ်မျဥ်းထူအရှည်ကို 1px, ညာဘက်ကို 4px၊ အောက်ဘက်ကို 6px, ဘယ်ဘက်ကို 8px ဟူ၍ သတ်မှတ်ပါမည်:

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

#elem {
	border-width: 1px 4px 6px 8px;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

ဥပမာ

သော့ချက်စကားလုံး thin ဖြင့် နယ်နိမိတ်မျဥ်းထူအရှည်ကို သတ်မှတ်ပါမည်:

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

#elem {
	border-width: thin;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

ဥပမာ

သော့ချက်စကားလုံး medium ဖြင့် နယ်နိမိတ်မျဥ်းထူအရှည်ကို သတ်မှတ်ပါမည်:

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

#elem {
	border-width: medium;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

ဥပမာ

သော့ချက်စကားလုံး thick ဖြင့် နယ်နိမိတ်မျဥ်းထူအရှည်ကို သတ်မှတ်ပါမည်:

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

#elem {
	border-width: thick;
	border-style: solid;
	border-color: black;
	width: 300px;
	height: 100px;
}

ဥပမာ

မတူညီသောဘက်များအတွက် မတူညီသော နယ်နိမိတ်မျဥ်းများကို သတ်မှတ်ပါမည်:

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

#elem {
	border-width: 1px 2px 3px 4px;
	border-style: dashed dotted solid double;
	border-color: red blue green black;
	width: 300px;
	height: 100px;
}

ဒီလည်းကြည့်ပါ

border-style ဂုဏ်သတ္တိ,
အရာသည် နယ်နိမိတ်မျဥ်း၏အသွင်အပြင်ကို သတ်မှတ်ပေးသည်
border-color ဂုဏ်သတ္တိ,
အရာသည် နယ်နိမိတ်မျဥ်း၏အရောင်ကို သတ်မှတ်ပေးသည်
border ဂုဏ်သတ္တိ,
အရာသည် နယ်နိမိတ်မျဥ်းအတွက် အတိုကောက်ဂုဏ်သတ္တိဖြစ်သည်