column-width ဂုဏ်သတ္တိ
column-width ဂုဏ်သတ္တိသည် အများကော်လံစာသားတွင် ကော်လံများ၏အကျယ်ကို သတ်မှတ်ပေးသည်။ ဂုဏ်သတ္တိ၏တန်ဖိုးမှာ အရွယ်အစားများအတွက် ယူနစ်များ (ရာခိုင်နှုန်းမှလွဲ၍) သို့မဟုတ် သော့ချက်စကားလုံး auto (စံထားချက်) ဖြစ်သည်။ တန်ဖိုး auto တွင် ဘရောက်ဆာသည် column-count နှင့် column-gap အပေါ် အခြေခံ၍ ကော်လံများ၏ အကောင်းဆုံးအကျယ်ကို သူ့ဘာသာ ရွေးချယ်သည်။
ဝါကျဖွဲ့စည်းပုံ
ရွေးချယ်သူ {
column-width: တန်ဖိုး;
}
နမူနာ . သတ်မှတ်ထားသောအကျယ်
ဤနမူနာတွင် ကော်လံ၏အကျယ် column-width ကို 150px ဟု သတ်မှတ်ထားပြီး ၎င်းတို့၏အရေအတွက် column-count ကို တန်ဖိုး auto တွင်ထားသည်။ ရလဒ်အဖြစ် ကော်လံများ၏အကျယ်မှာ 150px ဖြစ်မည်၊ ၎င်းတို့၏အရေအတွက်နှင့် ၎င်းတို့ကြားရှိ ကြားအကွာအဝေးကို ဘရောက်ဆာက သူ့ဘာသာ ရွေးချယ်မည်။
<div id="elem">
some long text
</div>
#elem {
column-count: auto;
column-width: 150px;
text-align: justify;
}
:
နမူနာ . auto တန်ဖိုး
ဤနမူနာတွင် စာသားသည် 3 ကော်လံခွဲမည် (အဘယ်ကြောင့်ဆိုသော် column-width ကို တန်ဖိုး 3 တွင် ထားသောကြောင့်)၊ သို့သော် ၎င်းတို့၏အကျယ်ကို အလိုအလျောက်တွက်ချက်မည်။
<div id="elem">
some long text
</div>
#elem {
column-width: auto;
column-count: 3;
text-align: justify;
}
:
ဤအကြောင်းကိုလည်း ကြည့်ပါ
-
column-countဂုဏ်သတ္တိ,
သည်ကော်လံအရေအတွက်ကို သတ်မှတ်ပေးသည် -
column-gapဂုဏ်သတ္တိ,
သည်ကော်လံများကြားရှိ ကြားအကွာအဝေးကို သတ်မှတ်ပေးသည် -
column-ruleဂုဏ်သတ္တိ,
သည်ကော်လံများကြားရှိ နယ်နိမိတ်ကို သတ်မှတ်ပေးသည် -
column-spanဂုဏ်သတ္တိ,
သည်အချောင်းအရေအတွက်ကို သတ်မှတ်ပေးသည်၊ အရာဝတ္ထုသည် မည်မျှအချောင်းဆန့်ထွက်သင့်သည် -
columnsဂုဏ်သတ္တိ,
သည်အများကော်လံအတွက် အတိုကောက်ဂုဏ်သတ္တိဖြစ်သည်