ပုံများ အမှတ်အသားများ: အကွယ်အပိုင်း

အရာ၏ အကွယ်အပိုင်း သည် အခြား အကွယ် နှင့် အကြောင်းအရာ အကြား ရှိသည်။ အရာ၏ အကွယ်အပိုင်း ကို ပြင်ဆင်သည့် အနှစ်ဆိုင်ရာ အကျယ်အဝန်း အဖွဲ့အစည်းအဖြစ် padding အကျယ်အဝန်း အဖွဲ့အစည်း ကို အသုံးပြုပါ။

CSS padding 属性定义元素边框与元素内容之间的空白区域。

CSS padding အက္ခရာ

CSS padding 属性定义元素的内边距。padding 属性接受长度值或百分比值，但不允许使用负值。

例如，如果您希望所有 h1 元素的各边都有 10 像素的内边距，只需要这样：

h1 {padding: 10px;}

您还可以按照上、右、下、左的顺序分别设置各边的内边距，各边均可以使用不同的单位或百分比值：

h1 {padding: 10px 0.25em 2ex 20%;}

单边内边距属性

也通过使用下面四个单独的属性，分别设置上、右、下、左内边距：

您也许已经想到了，下面的规则实现的效果与上面的简写规则是完全相同的：

h1 {
  padding-top: 10px;
  padding-right: 0.25em;
  padding-bottom: 2ex;
  padding-left: 20%;
  }

အကွက်အဝေးချိန် ဗုံးအချိန်အောက်ပိုင်းအဝေးချိန်

အချက်အရာကို အကွက်အဝေးချိန် ဗုံးအချိန်အောက်ပိုင်းအဝေးချိန် ဖြင့် ဖော်ပြထားသည်။ ဗုံးအချိန်အောက်ပိုင်းအဝေးချိန် သည် အကွက်ပေါ်အရာ၏ width အောက်ပိုင်းအဝေးချိန်ထက် ဖြစ်သည်။ အကွက်ပေါ်အရာ၏ width ပြောင်းလဲလျှင် အကွက်အဝေးချိန်များလည်း ပြောင်းလဲလျှင် ဖြစ်သည်

အောက်ပါအချက်ကို ဖော်ပြထားသည်။ အချက်အရာ၏ အကွက်အဝေးချိန်ကို အကွက်ပေါ်အရာ၏ width အောက်ပိုင်းအဝေးချိန်၏ 10% ဖြစ်သည်

p {padding: 10%;}

ဥပမာ၊ အချက်အရာတစ်ခု၏ အကွက်ပေါ်အရာဖြစ်သော div အချက်အရာကို သုံးပြီး အကွက်အဝေးချိန်ကို ဖော်ပြထားသည်။

<div style="width: 200px;">
<p>This paragraph is contained within a DIV that has a width of 200 pixels.</p>
</div>

အမှန်တကယ်အောက်ပိုင်းအဝေးချိန်၊ အရှေ့ပိုင်းအဝေးချိန် နှင့် အမြောက်ပိုင်းအဝေးချိန် အတူတူဖြစ်သည်။ အောက်ပိုင်းအဝေးချိန်၏ ဗုံးအချိန်အောက်ပိုင်းအဝေးချိန် သည် အကွက်အချိန်၏ အရှေ့အချိန်ထက် အမြောက်အချိန်ထက် ဖြစ်သည်။

CSS အကွက်အောက်ပိုင်းအဝေးချိန် အကျိုးအချက်

အကွက်အောက်ပိုင်းအဝေးချိန် အစိတ်အစိတ်ကို ဖော်ပြထားသည်
ဤအကျိုးအချက်ကို ပြပေးသည်။ ချက်ပေါ်တွင် အကွက်အောက်ပိုင်းအဝေးချိန် အစိတ်အစိတ်ကို သုံးပြီး ဖော်ပြထားသည်။
အောက်ပိုင်းအဝေးချိန် 1 ဖော်ပြထားသည်
ဤအကျိုးအချက်ကို ပြပေးသည်။ ချက်အောက်ပိုင်းကို ဗုံးအချိန်ကို သုံးပြီး ဖော်ပြထားသည်။
အောက်ပိုင်းအဝေးချိန် 2 ဖော်ပြထားသည်
ဤအကျိုးအချက်ကို ပြပေးသည်။ ချက်အောက်ပိုင်းကို ဗုံးအချိန်ကို သုံးပြီး ဖော်ပြထားသည်။
အောက်ပိုင်းအဝေးချိန် 1 ဖော်ပြထားသည်
ဤအကျိုးအချက်ကို ပြပေးသည်။ ချက်အောက်ပိုင်းကို ဗုံးအချိန်ကို သုံးပြီး ဖော်ပြထားသည်။
အောက်ပိုင်းအဝေးချိန် 2 ဖော်ပြထားသည်
ဤအကျိုးအချက်ကို ပြပေးသည်။ ချက်အောက်ပိုင်းကို အကွက်ပေါ်တွင် ဗုံးအချိန်အောက်ပိုင်းအဝေးချိန်ကို သုံးပြီး ဖော်ပြထားသည်။
设置右内边距 1
本例演示如何使用厘米值来设置单元格的右内边距。
设置右内边距 2
本例演示如何使用百分比值来设置单元格的右内边距。
设置上内边距 1
本例演示如何使用厘米值来设置单元格的上内边距。
设置上内边距 2
本例演示如何使用百分比值来设置单元格的上内边距。

CSS 内边距属性

属性 描述
padding 简写属性。作用是在一个声明中设置元素的所内边距属性。
padding-bottom 设置元素的下内边距。
padding-left 设置元素的左内边距。
padding-right 设置元素的右内边距。
padding-top 设置元素的上内边距。