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

border-spacing ဂုဏ်သတ္တိသည် HTML ဇယားကွက် ၏ td သို့မဟုတ် th ဆဲလ်များအကြား (နှင့် ဆဲလ်နယ်နိမိတ်နှင့် ဇယားကွက်ကိုယ်တိုင်၏ နယ်နိမိတ်အကြား) အကွာအဝေးကို သတ်မှတ်ပေးသည်။ ဂုဏ်သတ္တိ၏ တန်ဖိုးမှာ ရာခိုင်နှုန်းများမှလွဲ၍ မည်သည့် အရွယ်အစားယူနစ်များ မဆို ဖြစ်နိုင်သည်။

ဝါကျဖွဲ့ပုံ

ရွေးချယ်မှု {
	border-spacing: တန်ဖိုးတစ်ခု သို့မဟုတ် နှစ်ခု;
}

တန်ဖိုးများ

တန်ဖိုး	ဖော်ပြချက်
တန်ဖိုးတစ်ခု	တန်ဖိုးတစ်ခုသည် ဒေါင်လိုက်နှင့် အလျားလိုက် ဆဲလ်များအကြား အကွာအဝေးတူညီစေရန် သတ်မှတ်ပေးသည်။
တန်ဖိုးနှစ်ခု	ပထမတန်ဖိုးသည် အလျားလိုက် အကွာအဝေးကို သတ်မှတ်ပြီး ဒုတိယတန်ဖိုးသည် ဒေါင်လိုက် အကွာအဝေးကို သတ်မှတ်ပေးသည်။

စံထားရှိသော တန်ဖိုး- 0။ သို့သော်၊ ဘရောက်ဆာအတွက် cellspacing ဂုဏ်သတ္တိ၏ ကိုယ်ပိုင်သတ်မှတ်ချက် (သုညမဟုတ်သော) ရှိနေသောကြောင့် ဆဲလ်များအကြား အကွာအဝေးများကို သင်မြင်တွေ့ရမည်ဖြစ်သည်။

မှတ်သားဖွယ်ရာများ

ဂုဏ်သတ္တိကို ၎င်း၏ဆဲလ်များအတွက်မဟုတ်ဘဲ ဇယားကွက်များအတွက် အသုံးပြုပါ (ဆဲလ်များအတွက် အလုပ်မလုပ်ပါ)။

အလားတူအကျိုးသက်ရောက်မှုကို margin ကို အသုံးပြု၍ ရယူ၍မရနိုင်ပါ၊ အဘယ်ကြောင့်ဆိုသော် ဇယားကွက်ဆဲလ်များအတွက် margin သည် အလုပ်မလုပ်ပါ။

border-collapse ဂုဏ်သတ္တိကို collapse တန်ဖိုးဖြင့် သတ်မှတ်ထားပါက - border-spacing သည် အလုပ်မလုပ်တော့ပါ။

နမူနာ . တန်ဖိုးတစ်ခု

ဆဲလ်များအကြား (နှင့် ဆဲလ်နှင့် ဇယားကွက်နယ်နိမိတ်အကြား) အကွာအဝေးကို 10px အတိုင်း ပြုလုပ်ကြပါစို့။

<table>
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
	<tr>
		<td>7</td>
		<td>8</td>
		<td>9</td>
	</tr>
</table>

table {
	border-spacing: 10px;
	border-collapse: separate;
	width: 400px;
	border: 1px solid red;
}
td {
	border: 1px solid red;
	text-align: center;
}

နမူနာ . တန်ဖိုးနှစ်ခု

ယခု အလျားလိုက်အတွက် 10px နှင့် ဒေါင်လိုက်အတွက် 30px အကွာအဝေးများ သတ်မှတ်ကြပါစို့။

<table>
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
	<tr>
		<td>7</td>
		<td>8</td>
		<td>9</td>
	</tr>
</table>

table {
	border-spacing: 10px 30px;
	border-collapse: separate;
	width: 400px;
	border: 1px solid red;
}
td {
	border: 1px solid red;
	text-align: center;
}

နမူနာ . border-collapse: collapse သတ်မှတ်ခြင်း

ဤနေရာတွင် border-collapse ဂုဏ်သတ္တိ၏ collapse တန်ဖိုးကြောင့် border-spacing သည် အလုပ်မလုပ်တော့ပါ။

<table>
	<tr>
		<td>1</td>
		<td>2</td>
		<td>3</td>
	</tr>
	<tr>
		<td>4</td>
		<td>5</td>
		<td>6</td>
	</tr>
	<tr>
		<td>7</td>
		<td>8</td>
		<td>9</td>
	</tr>
</table>

table {
	border-collapse: collapse;
	border-spacing: 10px 30px;
	width: 400px;
	border: 1px solid red;
}
td {
	border: 1px solid red;
	text-align: center;
}