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

column-count ဂုဏ်သတ္တိသည် စာသားအများကော်လံစနစ်တွင် ကော်လံအရေအတွက် အကြံပြုချက် တစ်ခုကို သတ်မှတ်ပေးသည်။ ကော်လံအများအပြားအတွက် ၎င်းတို့၏ တကယ့်အရေအတွက်သည် သတ်မှတ်ထားသည့် အရေအတွက်နှင့် ကွဲပြားနိုင်သည်၊ ထိုကွဲပြားမှုသည် ကော်လံ၏အကျယ်နှင့် ၎င်းတို့ကြားရှိ အကွာအဝေးအရွယ်အစားပေါ်တွင် မူတည်ပါသည်။

ဝါကျဖွဲ့စည်းပုံ

cssselector {
  column-count: number | auto;
}

တန်ဖိုးများ

ပုံသေတန်ဖိုး: auto.

ဥပမာ

ဤဥပမာတွင် စာသားကို 3 ကော်လံအဖြစ် ပိုင်းခြားသွားမည်ဖြစ်သည် (သေချာသည်မှာ၊ အများကော်လံစနစ်ကို ထောက်ပံ့သော ဘရောက်ဆာများတွင် ဖြစ်ပြီး၊ ကျန်သည်များတွင်မူ ကော်လံတစ်ခုတည်းဖြင့် သာမန်စာသားသာဖြစ်နေမည်):

html<div id="elem">
  some long text
</div>

css#elem {
  column-count: 3;
  text-align: justify;
}

Результат:

ဥပမာ . auto တန်ဖိုး

ဤဥပမာတွင် ကော်လံ၏အကျယ် column-width ကို 150px ဖြင့် သတ်မှတ်ထားပြီး၊ ၎င်းတို့၏ အရေအတွက် column-count ကို auto တန်ဖိုးဖြင့် ထားရှိထားသည် - ဘရောက်ဆာသည် မိမိဘာသာ လိုအပ်သော ကော်လံအရေအတွက်နှင့် ၎င်းတို့ကြားရှိ အကွာအဝေးကို ရွေးချယ်ပေးမည်:

html<div id="elem">
  some long text
</div>

css#elem {
  column-count: auto;
  column-width: 150px;
  text-align: justify;
}

Результат:

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