သင့်ရဲ့မာဂျင်နှင့်နယ်ခြားမဲ့ထဲကသုညမှ CSS ကိုသုံးပါ

ယနေ့ web browser ကို Cross-browser ကိုရှေ့နောက်ညီညွတ်မှုမဆိုကြင်နာဖြစ်ချင်ဇောရှိရာအရူးလက်ထက် မှစ. ရှည်လျားသောလမ်းလာခဲ့ပါသည်။ ယနေ့ web browsers တွေအားလုံးအလွန်စံချိန်စံညွှန်းများ-compliant ဖြစ်ကြသည်။ သူတို့ကကြင်အတူတူဆော့ကစားခြင်းနှင့်အမျိုးမျိုးသော browser များအနှံ့တစ်ဦးမျှမျှတတတသမတ်တည်းစာမျက်နှာ display ကိုကယ်နှုတ်တော်မူ။ ဒါက Google Chrome ကို Microsoft က Edge, Mozilla Firefox ကို, အော်ပရာ, Safari, နဲ့အပေါ်ကိုတွေ့အမျိုးမျိုးသော browser များ၏နောက်ဆုံးပေါ်ဗားရှင်းလည်းပါဝင်သည် မိုဘိုင်းဖုန်းများများပြားလှသော ယနေ့က်ဘ်ဆိုက်ဝင်ရောက်ကြည့်ရှုရန်အသုံးပြုခံရ။

ဒါကြောင့်ကို web browser များမှကြွလာသောအခါတိုးတက်မှုဆက်ဆက်လုပ်ထားပြီးသူတို့ CSS ကိုဖော်ပြရန်ဘယ်လိုနေစဉ်တွင်ဤအမျိုးမျိုးသော software ကိုရွေးချယ်စရာအကြားရှေ့နောက်မညီနေတုန်းပဲရှိပါတယ်။ ဘုံရှေ့နောက်မညီတစ်ခုမှာသူတို့အား browser များ default အနေဖြင့်အမြတ်, padding ကိုနှင့်နယ်နိမိတ်တွက်ချက်ပုံဖြစ်ပါသည်။

အဘယ်ကြောင့်ဆိုသော်သေတ္တာမော်ဒယ်အကျိုးသက်ရောက်မှုဤရှုထောင့်အားလုံးက HTML element တွေရဲ့, သူတို့စာမျက်နှာအပြင်အဆင်ဖန်တီးခြင်းအတွက်မရှိမဖြစ်လိုအပ်သောကြောင့်တစ်ဦးကိုက်ညီမှု display ကိုစာမျက်နှာတဦးတည်းကို browser အတွက်အကြီးအကြည့်ပေမယ့်အခြားအတွင်းချွတ်အနည်းငယ်ကြည့်ရှုစေခြင်းငှါဆိုလိုသည်။ ဤပြဿနာကိုတိုက်ဖျက်ဖို့, များစွာသောက်ဘ်ဆိုက်ဒီဇိုင်း box ကိုမော်ဒယ်ဤရှုထောင့်ကိုပုံမှန်။ ဒီအလေ့အကျင့်လည်းအမြတ်, padding ကိုနှင့်နယ်နိမိတ်များအတွက်တန်ဖိုးများ "ထွက် zeroing" အဖြစ်လူသိများသည်။

Browser ကို Defaults ကိုအပေါ်တစ်ဦးကမှတ်ချက်

web browsers အားလုံးစာမျက်နှာအချို့ display ကိုရှုထောင့်အဘို့ကို default setting များကိုရှိသည်။ ဥပမာ, hyperlink များအပြာနှင့်ပုံမှန်အားဖြင့်မျဉ်းသားဖြစ်ကြ၏။ ဒါဟာအမျိုးမျိုးသော browser များအနှံ့တသမတ်တည်းဖြစ်တယ်, ဒါကြောင့်အများဆုံးဒီဇိုင်နာများသူတို့ရဲ့သီးခြားပရောဂျက်ဒီဇိုင်းလိုအပ်ချက်နှင့်ကိုက်ညီရန်ကိုပြောင်းလဲကြောင်းအရာတစ်ခုခုသည်ပေမယ့်သူတို့အားလုံးတူပေးထားတဲ့ defaults နှင့်အတူစတင်နေကြသည်ဟူသောအချက်ကိုလွယ်ကူသည်ဤအပြောင်းအလဲများကိုလုပ်စေသည်။ ဝမ်းနည်းစရာ, မာဂျင်, padding ကိုနှင့်နယ်နိမိတ်များအတွက် default value ကို Cross-browser ကိုရှေ့နောက်ညီညွတ်မှု၏တူညီသောအဆင့်ကိုပျော်မွေ့ကြပါဘူး။

margin နဲ့ padding များအတွက် Normal တန်ဖိုးများ

ကိုက်ညီမှုသေတ္တာမော်ဒယ်များ၏ပြဿနာကိုဖြေရှင်းရန်အကောင်းဆုံးနည်းလမ်းသုညမှ HTML element တွေကိုအပေါငျးတို့သမာဂျင်နှင့် padding ကိုတန်ဖိုးများသတ်မှတ်ထားရန်ဖြစ်ပါသည်။ သင်ဤသည်သင်၏ကိုနှိပ်ပြီးဤ CSS ကိုစည်းမျဉ်းကိုထည့်သွင်းဖို့ဖြစ်ပါတယ်လုပ်ပေးနိုင်ကြောင်းအနည်းငယ်နည်းလမ်းတွေရှိပါတယ်:

* {margin: 0; padding ကို: 0; }

ဤသည် CSS ကိုစည်းမျဉ်း * သို့မဟုတ်သံခိတ်ဇာတ်ကောင်အသုံးပြုသည်။ အဲဒီဇာတ်ကောင် "လူအပေါင်းတို့သည်ဒြပ်စင်" ကိုဆိုလိုသည်ကအခြေခံအားဖြင့်တိုင်းက HTML element ကို select လုပ်ပါကသင့်ရဲ့ပြင်ပကိုနှိပ်ပြီးအတွက်ကြောင့်ဤနည်းဥပဒေအလွန် unspecific သော်လည်း 0. ရန်မာဂျင်နှင့် padding ကိုသတ်မှတ်ထားလိမ့်မယ်က default အနေနဲ့ browser ကိုထက်ပိုမိုမြင့်မားတိကျတဲ့ရပါလိမ့်မယ် တန်ဖိုးများကိုလုပ်ပါ။ သူတို့အားမူလပုံစံများကိုသငျသညျ overwrite လုပ်နိုင်တဲ့နေကြသည်ဘာတွေလုပ်နေလဲကတည်းကဒီတစ်ခုစတိုင်သင်ပြုအထဲက setting နေကြတယ်ဆိုတာကိုပြီးမြောက်ပါလိမ့်မယ်။

နောက်ထပ် option ကို HTML နဲ့ခန္ဓာကိုယ်ဒြပ်စင်ဤတန်ဖိုးများကိုလျှောက်ထားရန်ဖြစ်ပါသည်။ သင့်စာမျက်နှာပေါ်မှာရှိသမျှအခြားဒြပ်စင်နှစ်ခုဒြပ်စင်များ၏သားသမီးများပါလိမ့်မည်သောကြောင့်, CSS ကိုအဆငျ့ဆငျ့သောသူအပေါင်းတို့သည်အခြားဒြပ်စင်များဤတန်ဖိုးများကိုလျှောက်ထားသင့်ပါတယ်။

html, body {margin: 0; padding ကို: 0; }

ဒါကအားလုံး browser များပေါ်တူရာအရပျ၌သင်တို့၏ဒီဇိုင်းကိုစတင်ပါလိမ့်မယ်, ဒါပေမယ့်မှတ်မိဖို့ရာတစျခုသောသင်အားလုံးမာဂျင်နှင့် padding ကိုကို turn off တခါ, သင်ကြည့်အောင်မြင်ရန်ရွေးချယ်သင်၏ဝဘ်စာမျက်နှာ၏တိကျသောစိတျအပိုငျးအတှကျကျောကသူတို့ကိုလှည့်ဖို့လိုအပ်ပါလိမ့်မယ်ဖြစ်ပါတယ် နှင့်သင့်ဒီဇိုင်းကိုတောင်းဆိုကြောင်းခံစားရသည်။

နယ်ခြားမဲ့

သငျသညျစဉ်းစားစေခြင်းငှါ "ဒါပေမယ့်ဘယ်သူမျှမက browser ကို default အားဖြင့်ခန္ဓာကိုယ်ဒြပ်စင်ပတ်လည်နယ်စပ်များ" ။ ဤသည်တင်းကြပ်စွာစစ်မှန်တဲ့မဟုတ်ပါဘူး။ က Internet Explorer ဗားရှင်းအဟောင်းဒြပ်စင်ပတ်ပတ်လည်တစ်ပွင့်လင်းသို့မဟုတ်မမြင်ရတဲ့နယ်စပ်ရှိသည်။ သငျသညျ, 0 ရန်သင့်စာမျက်နှာအပြင်အဆင်ကြောင့်နယ်စပ်လုပ်နိုင်တဲ့ရှုပ်ထွေးနယ်စပ်ကို set up မဟုတ်လျှင်။ သင်က IE ဤ antiquated ဗားရှင်းကိုထောကျပံ့များဆက်လက်လိမ့်မည်ဟုဆုံးဖြတ်လိုက်ကြပြီဆိုပါက, သင်သည်သင်၏ခန္ဓာကိုယ်နဲ့ HTML စတိုင်များမှအောက်ပါဖြည့်စွက်အားဖြင့်ဒီကိုင်တွယ်ဖြေရှင်းဖို့လိုအပ်ပါလိမ့်မယ်:

HTML ကို, ကိုယျခန်ဓာ {
margin: 0px;
padding ကို: 0px;
နယ်စပ်: 0px;
}

သင်မာဂျင်နှင့် padding ကိုပိတ်ထားဘယ်လိုဆင်တူ, ဒီသစ်ကိုစတိုင်လည်း Default အနေနဲ့နယ်စပ်ကို turn off ပါလိမ့်မယ်။ သင်တို့သည်လည်းအစောပိုင်းကဆောင်းပါးမှာပြထားတဲ့သံခိတ် selector သုံးပြီးအားဖြင့်အတူတူပါပဲလုပ်ပေးနိုင်ဘူး။

ဂျနီဖာ Krynin ခြင်းဖြင့်မူရင်းဆောင်းပါး။ 9/27/16 အပေါ်ဂျယ်ရမီ Girard တည်းဖြတ်။