စက်တင်ချိန် အခြေခံ ပုံစံ ခွဲ

အသုံးပြုနည်းနှင့် ပြုံးဖြတ်

grid-template-columns အခြေအနေ အားဖြင့် အခြေအနေ နှင့် အရှည်အဝိုက် ကို သုံးစွဲပါ。

အားဖြင့် အဆင့်ကို ဖြတ်သို့ပါ。

အခြားကြည့်

CSS ဖော်ပြCSS ပေါ်လွှတ်

CSS ကြည့်ရှားgrid-template-rows အခြေအနေ

CSS ကြည့်ရှားgrid-template အခြေအနေ

အမှတ်

အမှတ် 1

အသုံးပြုပြီး အသုံးပြုသော အခြေအနေကို သုံးစွဲပါ。

.grid-container {
  display: grid;
  grid-template-columns: auto auto auto auto;
}

ကိုယ်တိုင် စစ်ဆေးပါ

အမှတ် 2

အသုံးပြုပြီး အသုံးပြုသော အခြေအနေကို သုံးစွဲပါ。

.grid-container {
  display: grid;
  grid-template-columns: 30px 200px auto 100px;
}

ကိုယ်တိုင် စစ်ဆေးပါ

CSS ပုံစံ

grid-template-columns: none|auto|max-content|min-content|length|initial|inherit;

အခြေအနေ

ပြင်ပ ဖော်ပြ
none မည်သည်မှ မမှန်
auto အရှည်အဝိုက် အရှို့ဆဲ့ ပြီး အရှည်အဝိုက် အရှို့ဆဲ့ အဆင့်ကို သုံးစွဲပါ。
max-content လုံးချင်း အရှည်အဝိုက် သုံးစွဲပါ。
min-content လုံးချင်း အရှည်အဝိုက် သုံးစွဲပါ。
length လုံးချင်း အရှည်အဝိုက် သုံးစွဲပါ。အရှည်အဝိုက်。
initial အခြေခံအခြေအနေကို သုံးစွဲပါ。 initial。
inherit မိဘအဖွဲ့မှ အကြိမ်ဖြစ်ပေါ်လာသော အခြေအနေကို သုံးစွဲပါ。 inherit。

နည်းပညာရှင်

မည်သည်မှ မမှန် none
ကြိုးစားမှု မမှန်
လှည့်ပတ်ခြင်းမူးယစ် ထောက်ပံ့ခြင်းလှည့်ပတ်ခြင်းအဖြစ်。
အဆင့် CSS Grid Layout Module Level 1
JavaScript ပုံစံ object.style.gridTemplateColumns="50px 50px 50px"

ဘရာဇက်ကမ်းကူးကြောင်း

အချက်အလက်များသည် ထိုအခြေအနေကို အကူအညီပေးသော အဖြူတွေးသံချိန်သည်ထဲမှ သုံးစွဲသော အဖြူတွေးသံချိန်အဆင့်ကို ညွှန်ပြသည်。

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44