ဝိသေသ min-width

ဝိသေသ min-width သည် အစိတ်အပိုင်း၏ အနည်းဆုံးအကျယ်ကို သတ်မှတ်ပေးသည်။ ဝိသေသ၏ တန်ဖိုးအဖြစ် မည်သည့် အရွယ်အစားယူနစ်မျိုးကိုမဆို သို့မဟုတ် none ဟူသော သော့ချက်စကားလုံးကို အသုံးပြုနိုင်ပြီး၊ ၎င်းသည် တန်ဖိုးမရှိခြင်းကို ဆိုလိုသည်။

ယေဘုယျအားဖြင့် အလွယ်တကူ ပြောင်းလဲနိုင်သော အကျယ်ရှိသည့် အစိတ်အပိုင်းအတွက် (အကျယ်ကို ရာခိုင်နှုန်းဖြင့် သတ်မှတ်ထားခြင်း သို့မဟုတ် လုံးဝမသတ်မှတ်ထားခြင်းဖြစ်ပြီး အစိတ်အပိုင်း၏အကျယ်သည် ၎င်း၏အကြောင်းအရာပေါ် မူတည်၍ ပြန့်ထွက်သွားသည်) သတ်မှတ်ပေးလေ့ရှိသည်။ အကယ်၍ အစိတ်အပိုင်း၏အကျယ်ကို ရာခိုင်နှုန်းဖြင့် သတ်မှတ်ထားပါက - ဘရောက်ဆာဝင်းဒိုး၏ အကျယ်ကို လျှော့ချသောအခါ ၎င်း၏အကျယ်သည်လည်း min-width ၏တန်ဖိုးသို့ မရောက်မချင်း လျော့သွားမည်ဖြစ်သည်။

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

cssရွေးချယ်သူ {
  max-width: တန်ဖိုး;
}

နမူနာ

ဤနမူနာတွင် အကျယ်သည် မိဘအစိတ်အပိုင်း၏ အကျယ်၏ ရာခိုင်နှုန်းအတိုင်းဖြစ်သည်။ ဘရောက်ဆာဝင်းဒိုး၏အကျယ်ကို လျှော့ချလိုက်ပါက၊ ကွန်တိန်နာသည်လည်း ဘရောက်ဆာဝင်းဒိုး၏အကျယ်နှင့် ကိုက်ညီစေရန် ကျဉ်းမြောင်းသွားမည်ဖြစ်သည်။ သို့သော် ၎င်းသည် min-width တွင် သတ်မှတ်ထားသည့် အတိုင်းအတာ 400px အထိသာ ကျဉ်းမြောင်းသွားမည်ဖြစ်သည်။ ကွန်တိန်နာသည် ဤအကျယ်သို့ရောက်ရှိသွားသည်နှင့် - ၎င်းသည် ဆက်လက်ကျဉ်းမြောင်းခြင်းမရှိတော့ပါ။

html<div id="elem"></div>
css#elem {
  width: 70%;
  min-width: 400px;
  height: 300px;
  border: 1px solid black;
}

Результат:

နမူနာ

ဤနမူနာတွင် ကွန်တိန်နာ၏အကျယ်ကို နှစ်ဖက်စလုံးမှ ကန့်သတ်ထားသည်။ ၎င်းသည် 900px ထက်ကြီး၍မရသကဲ့သို့ 400px ထက်ငယ်၍လည်းမရနိုင်ပါ။

html<div id="elem"></div>
css#elem {
  width: 70%;
  min-width: 400px;
  max-width: 900px;
  height: 100px;
  border: 1px solid black;
}

Результат:

ဤအကြောင်းကိုလည်း ကြည့်ပါ

  • ဝိသေသ max-width,
    သည် အစိတ်အပိုင်း၏ အများဆုံးအကျယ်ကို သတ်မှတ်ပေးသည်
  • ဝိသေသ max-height,
    သည် အစိတ်အပိုင်း၏ အများဆုံးအမြင့်ကို သတ်မှတ်ပေးသည်
  • ဝိသေသ min-height,
    သည် အစိတ်အပိုင်း၏ အနည်းဆုံးအမြင့်ကို သတ်မှတ်ပေးသည်