CSS ကော်လံအကျယ် ပိုင်ဆိုင်မှု
ဥပမာ
ကော်လံအကျယ်သည် 100px ဖြစ်သင့်သည်ဟု သတ်မှတ်ပါ-
div
{
column-width: 100px;
}
အောက်တွင် နောက်ထပ် "စမ်းသုံးကြည့်ပါ" ဥပမာများ။
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
ပိုင်ဆိုင်မှု သည် column-width
ကော်လံအကျယ်ကို သတ်မှတ်သည်။
ကော်လံအရေအတွက်သည် ဒြပ်စင်တစ်ခွင်ရှိ အကြောင်းအရာအားလုံးကို ပြသရန် လိုအပ်သော ကော်လံအနိမ့်ဆုံးအရေအတွက်ဖြစ်သည်။
column-width
ပြောင်းလွယ်ပြင်လွယ်ပိုင်ဆိုင်မှုတစ်ခုဖြစ်သည်။ ဘရောက်ဆာအတွက် အနည်းဆုံးအကျယ်အကြံပြုချက်column-width
အဖြစ် စဉ်းစားပါ
။ ဘရောင်ဇာသည် သင့်သတ်မှတ်ထားသော အကျယ်တွင် အနည်းဆုံး ကော်လံနှစ်ခုကို အံမဝင်နိုင်ပါက ကော်လံများသည် ရပ်သွားပြီး ကော်လံတစ်ခုထဲသို့ ကျသွားပါမည်။
မူလတန်ဖိုး: | အော်တို |
---|---|
အမွေဆက်ခံသည်- | မဟုတ်ဘူး |
သက်ဝင်လှုပ်ရှားနိုင်သော | ဟုတ်တယ် ကာတွန်း အကြောင်းဖတ်ပါ။ |
ဗားရှင်း- | CSS3 |
JavaScript syntax- | အရာဝတ္ထု .style.columnWidth="100px" |
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် ပိုင်ဆိုင်မှုကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးသည်။
-webkit- သို့မဟုတ် -moz- ဖြင့်လိုက်သောနံပါတ်များကို ရှေ့ဆက်တွဲဖြင့်လုပ်ဆောင်သော ပထမဆုံးဗားရှင်းကို သတ်မှတ်ပေးသည်။
Property | |||||
---|---|---|---|---|---|
column-width | 50.0 4.0 -webkit- |
10.0 | 52.0 2.0 -moz- |
9.0 3.1 -webkit- |
37.0 15.0 -webkit- 11.1 |
CSS Syntax
column-width: auto|length|initial|inherit;
အိမ်ခြံမြေတန်ဖိုးများ
Value | Description | Play it |
---|---|---|
auto | Default value. The column width will be determined by the browser | |
length | A length that specifies the width of the columns. The number of columns will be the minimum number of columns needed to show all the content across the element. Read about length units | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
နောက်ထပ် ဥပမာများ
ဥပမာ
<div> ဒြပ်စင်တစ်ခုတွင် စာသားကို ကော်လံသုံးခုသို့ ပိုင်းခြားပါ။
div
{
column-count: 3;
}
ဥပမာ
ကော်လံများကြား 40 pixels ကွာဟချက်ကို သတ်မှတ်ပါ-
div
{
column-gap: 40px;
}
ဥပမာ
ကော်လံများအကြား စည်းကမ်း၏ အကျယ်၊ ပုံစံနှင့် အရောင်ကို သတ်မှတ်ပါ-
div
{
column-rule: 4px double #ff00ff;
}
ဆက်စပ်စာမျက်နှာများ
CSS သင်ခန်းစာ- CSS Multiple Columns
HTML DOM ရည်ညွှန်းချက်- columnWidth ပိုင်ဆိုင်မှု