CSS width Property
ဥပမာ
<div> ဒြပ်စင်သုံးခု၏ အကျယ်ကို သတ်မှတ်ပါ-
div.a {
width: auto;
border: 1px
solid black;
}
div.b {
width: 150px;
border: 1px solid black;
}
div.c {
width:
50%;
border: 1px solid black;
}
အောက်တွင် နောက်ထပ် "စမ်းသုံးကြည့်ပါ" ဥပမာများ။
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
ပိုင်ဆိုင်မှု သည် width
ဒြပ်စင်တစ်ခု၏ အကျယ်ကို သတ်မှတ်သည်။
ဒြပ်စင်တစ်ခု၏ အကျယ်သည် အကွက်များ၊ ဘောင်များ သို့မဟုတ် အနားသတ်များ မပါဝင်ပါ။
မှတ်ချက်- min -width နှင့်
max-width ဂုဏ်သတ္တိများသည် ပိုင်ဆိုင်မှုကို လွှမ်းမိုး width
ထားသည်။
မူလတန်ဖိုး: | အော်တို |
---|---|
အမွေဆက်ခံသည်- | မဟုတ်ဘူး |
သက်ဝင်လှုပ်ရှားနိုင်သော | ဟုတ်တယ် ကာတွန်း အကြောင်းဖတ်ပါ။ |
ဗားရှင်း- | CSS1 |
JavaScript syntax- | အရာဝတ္ထု .style.width="500px" |
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် ပိုင်ဆိုင်မှုကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးသည်။
Property | |||||
---|---|---|---|---|---|
width | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
CSS Syntax
width: auto|value|initial|inherit;
အိမ်ခြံမြေတန်ဖိုးများ
Value | Description | Play it |
---|---|---|
auto | Default value. The browser calculates the width | |
length | Defines the width in px, cm, etc. Read about length units | |
% | Defines the width in percent of the containing block | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
နောက်ထပ် ဥပမာများ
ဥပမာ
ရာခိုင်နှုန်းတန်ဖိုးကို အသုံးပြု၍ <img> ဒြပ်စင်တစ်ခု၏ အကျယ်ကို သတ်မှတ်ပါ-
img {
width: 50%;
}
ဥပမာ
<input type="text">ဒြပ်စင်တစ်ခု၏ အကျယ်ကို 100px သို့ သတ်မှတ်ပါ။ သို့သော် အာရုံစူးစိုက်မှုရရှိသောအခါ၊ ၎င်းကို 250px ကျယ်အောင်လုပ်ပါ-
input[type=text] {
width: 100px;
}
input[type=text]:focus {
width: 250px;
}
ဆက်စပ်စာမျက်နှာများ
CSS သင်ခန်းစာ- CSS အမြင့်နှင့် အနံ
CSS သင်ခန်းစာ- CSS Box မော်ဒယ်
CSS ရည်ညွှန်းချက်- အမြင့် ပိုင်ဆိုင်မှု
HTML DOM ရည်ညွှန်းချက်- အကျယ်ပိုင်ဆိုင်မှု