CSS Layout - width နှင့် max-width
အကျယ်၊ အများဆုံး-အကျယ်နှင့် အနားသတ်များကို အသုံးပြုခြင်း- အော်တို;
ယခင်အခန်းတွင်ဖော်ပြထားသည့်အတိုင်း; ဘလောက်အဆင့်ဒြပ်စင်သည် ရနိုင်သော အကျယ်ကို အမြဲတမ်းယူသည် (၎င်းကို တတ်နိုင်သမျှ ဘယ်ညာသို့ ဆန့်ထုတ်သည်)။
ဘလောက်အဆင့်ဒြပ်စင်ကို သတ်မှတ်ခြင်း width
က ၎င်းကို ၎င်း၏ကွန်တိန်နာ၏အစွန်းများအထိ ဆန့်ထုတ်ခြင်းမှ တားဆီးမည်ဖြစ်သည်။ ထို့နောက်၊ သင်သည် ၎င်း၏ကွန်တိန်နာအတွင်း ဒြပ်စင်ကို အလျားလိုက်ဗဟိုပြုရန် အနားသတ်များကို အလိုအလျောက်သတ်မှတ်နိုင်သည်။ ဒြပ်စင်သည် သတ်မှတ်ထားသော အကျယ်ကို ယူမည်ဖြစ်ပြီး ကျန်နေရာအား အနားသတ်နှစ်ခုကြားတွင် အညီအမျှ ခွဲသွားပါမည်-
မှတ်ချက်-<div>
ဘရောက်ဆာဝင်းဒိုးသည် ဒြပ်စင်၏ အကျယ်ထက် သေးငယ်သောအခါတွင် အထက်ဖော်ပြပါ ပြဿနာ သည် ဖြစ်ပေါ်လာသည်။ ထို့နောက် ဘရောက်ဆာသည် စာမျက်နှာသို့ အလျားလိုက် scrollbar တစ်ခုကို ပေါင်းထည့်သည်။
max-width
ဤအခြေအနေတွင် ယင်းအစား အသုံးပြုခြင်းဖြင့် ဘရောက်ဆာ၏ သေးငယ်သော ဝင်းဒိုးများကို ကိုင်တွယ်မှု ပိုမိုကောင်းမွန်လာမည်ဖြစ်သည်။ စက်ပစ္စည်းငယ်များတွင် အသုံးပြုနိုင်သော ဝဘ်ဆိုက်တစ်ခုကို ပြုလုပ်ရာတွင် ၎င်းသည် အရေးကြီးသည်-
အကြံပြုချက်- div နှစ်ခုကြားခြားနားချက်ကိုကြည့်ရန် ဘရောက်ဆာဝင်းဒိုးကို 500px ထက်နည်းသော အကျယ်သို့ အရွယ်အစားပြောင်းပါ။
ဤသည်မှာ အထက်ဖော်ပြပါ div နှစ်ခု၏ ဥပမာတစ်ခုဖြစ်သည်။
ဥပမာ
div.ex1 {
width: 500px;
margin:
auto;
border: 3px solid #73AD21;
}
div.ex2 {
max-width: 500px;
margin: auto;
border: 3px solid #73AD21;
}