column-rule ဂုဏ်သတ္တိ

column-rule ဂုဏ်သတ္တိသည် ကော်လံခွဲစာသားတွင် ကော်လံများကြားရှိ နယ်နမိတ်မျဉ်းကို သတ်မှတ်ပေးသည်။ ယူနည်းများအရ ထပ်တူညီသော ဂုဏ်သတ္တိဖြစ်သည် border။

ဥပမာ . အမျိုးအစား solid

ဤဥပမာတွင် စာသားသည် 3 ကော်လံများအဖြစ် ခွဲခြားသွားမည်ဖြစ်ပြီး ကော်လံများကြားတွင် နယ်နမိတ်မျဉ်းများမှာ အထူ 1px ရှိသော ဆက်တိုက်မျဉ်း (ကော်လံများကြား အကွာအဝေး ကိုအလိုအလျောက်ဖြစ်ပေါ်စေမည်။ အကြောင်းမှာ column-gap တန်ဖိုးကို normal အဖြစ် သတ်မှတ်ထားသောကြောင့်ဖြစ်သည်):

html<div id="elem">
  some long text
</div>
css#elem {
  column-rule: 1px solid black;
  column-count: 3;
  column-gap: normal;
  text-align: justify;
}

Результат:

ဥပမာ . column-gap ၏ သက်ရောက်မှု

ဤဥပမာတွင် စာသားသည် 3 ကော်လံများအဖြစ် ခွဲခြားသွားမည်ဖြစ်ပြီး ၎င်းတို့ကြားတွင် 50px အကွာအဝေးရှိမည်။ နယ်နမိတ်မျဉ်းသည် ထိုအကွာအဝေး၏ အလယ်ဗဟိုတွင် ဖြတ်သွားမည် (နယ်နမိတ်မျဉ်း၏ ညာဘက်နှင့် ဘယ်ဘက်တွင် 25px စီ ရှိမည်):

html<div id="elem">
  some long text
</div>
css#elem {
  column-rule: 1px solid black;
  column-count: 3;
  column-gap: 50px;
  text-align: justify;
}

Результат:

ဤအရာကိုလည်း ကြည့်ပါ

  • column-width ဂုဏ်သတ္တိ,
    အရာသည် ကော်လံ၏အကျယ်ကို သတ်မှတ်ပေးသည်
  • column-count ဂုဏ်သတ္တိ,
    အရာသည် ကော်လံအရေအတွက်ကို သတ်မှတ်ပေးသည်
  • column-gap ဂုဏ်သတ္တိ,
    အရာသည် ကော်လံများကြား အကွာအဝေးကို သတ်မှတ်ပေးသည်
  • column-span ဂုဏ်သတ္တိ,
    အရာသည် အရာ၀တ္ထုတစ်ခု ပြန့်ကားသင့်သော ကော်လံအရေအတွက်ကို သတ်မှတ်ပေးသည်
  • columns ဂုဏ်သတ္တိ,
    အရာသည် ကော်လံခွဲခြင်းအတွက် အတိုကောက် ဂုဏ်သတ္တိဖြစ်သည်