caption-side ဂုဏ်သတ္တိ

caption-side ဂုဏ်သတ္တိသည် <caption> တဂ်ကို အသုံးပြု၍ ဖန်တီးထားသော ဇယား၏ ခေါင်းစဉ် တည်နေရာကို သတ်မှတ်ပေးသည်။ ယင်း ဂုဏ်သတ္တိတွင် တန်ဖိုးနှစ်မျိုး ရှိနိုင်ပါသည်။ ၎င်းတို့မှာ top (ဇယား၏ အပေါ်ဘက်၊ ပုံသေအားဖြင့်) နှင့် bottom (ဇယား၏ အောက်ဘက်) တို့ ဖြစ်သည်။

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

selector {
	caption-side: top | bottom;
}

နမူနာ

ဇယားခေါင်းစဉ်ကို ဇယား၏ အပေါ်ဘက်တွင် ထားရှိကြပါစို့။

<table border="1" width="300">
	<caption>ဇယား</caption>
	<tr>
		<th>ခေါင်းစဉ်</th>
		<th>ဖော်ပြချက်</th>
	</tr>
	<tr>
		<td>စာသား ၁</td>
		<td>စာသား ၂</td>
	</tr>
</table>

table {
	width: 100%;
	border-collapse: collapse;
}
td {
	width: 200px;
	height: 100px;
	text-align: center;
}
caption {
	caption-side: top;
	font-weight: bold;
}

နမူနာ

ယခုတော့ ခေါင်းစဉ်ကို ဇယား၏ အောက်ဘက်သို့ ရွှေ့ကြည့်ပါမည်။

<table border="1" width="300">
	<caption>ဇယား</caption>
	<tr>
		<th>ခေါင်းစါ်</th>
		<th>ဖော်ပြချက်</th>
	</tr>
	<tr>
		<td>စာသား ၁</td>
		<td>စာသား ၂</td>
	</tr>
</table>

table {
	width: 100%;
	border-collapse: collapse;
}
td {
	width: 200px;
	height: 100px;
	text-align: center;
}
caption {
	caption-side: bottom;
	font-weight: bold;
}

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

bottom ဂုဏ်သတ္တိ၊
အရာသည် အစိတ်အပိုင်း၏ အောက်ဆုံးအနားကို တည်နေရာသတ်မှတ်ပေးသည်
top ဂုဏ်သတ္တိ၊
အရာသည် အစိတ်အပိုင်း၏ အပေါ်ဆုံးအနားကို တည်နေရာသတ်မှတ်ပေးသည်
left ဂုဏ်သတ္တိ၊
အရာသည် အစိတ်အပိုင်း၏ ဘယ်ဘက်အနားကို တည်နေရာသတ်မှတ်ပေးသည်
right ဂုဏ်သတ္တိ၊
အရာသည် အစိတ်အပိုင်း၏ ညာဘက်အနားကို တည်နေရာသတ်မှတ်ပေးသည်
::backdrop ရှေ့ဆက်-အစိတ်အပိုင်း၊
အရာသည် ပထမဆုံးအစိတ်အပိုင်းပြီးနောက် တည်နေရာကို သတ်မှတ်ပေးသည်