ဤအကြံပြုချက်များနှင့်အတူဖြစ်ရပ်မှန်များကိုရယူပါ
အားလုံးကို web browser များအဖြစ်ကိုသိသောအရာကိုပါဝင်သည် "defauly စတိုင်များ။ " ဤရွေ့ကားမဆိုအခြားစတိုင်အချက်အလက်များ၏မရှိခြင်းအတွက် HTML element တွေရဲ့ကြည့်နှင့်ခံစား dictate ကြောင်းစတိုင်များဖြစ်ကြသည်။ ဥပမာအားဖြင့်, နီးပါးတိုင်း browser မှာ hyperlink များ၏ default အကြည့်တစ်ခုမျဉ်းသားနှင့်အတူတစ်ပြောင်ပြောင်တောက်သောအပြာအရောင်ဖြစ်ပါတယ်။ ဤသည်သင်တစ်ဦးကွဲပြားခြားနားသောလမ်းအတွက်ဖော်ပြရန်သူတို့ကိုပြောပြမဟုတ်လျှင်သူတို့အားလင့်များကိုကြည့်ဘယ်လောက်ဖြစ်ပါတယ်။
default browser စတိုင်များအထောက်အကူဖြစ်စေနိုင်ပါတယ်, ဒါပေမယ့်အများအပြားကိစ္စများတွင်ရှိသော web designer သူတို့ထိန်းချုပ်အတွက် 100% ဖြစ်ကြောင်းစတိုင်များနှင့်အတူလတ်ဆတ်တဲ့ start နိုင်အောင်ထိုအစတိုင်များကိုဖယ်ရှားလို။ ဒါကအဖြစ်လူသိများသည်အဘယ်အရာကိုသုံးပြီးပြု "မာစတာကိုနှိပ်ပြီး။ "
တစ်ဦးကမာစတာကိုနှိပ်ပြီးသင်တို့ရှိသမျှကိုသင်၏စာရွက်စာတမ်းများအတွက်ကိုပဌနာကိုပထမဦးဆုံးကိုနှိပ်ပြီးဖြစ်သင့်သည်။ သငျသညျ Cross-browser ကိုက်ဘ်ဒီဇိုင်းအတွက်ပြဿနာများကိုဖြစ်ပေါ်စေနိုငျသောက default browser setting ကိုထုတ်ရှင်းလင်းဖို့မာစတာကိုနှိပ်ပြီးအသုံးပြုပါ။ ပန်းချီအဘို့စင်ကြယ်ပတ္တူနဲ့တူ - သင်ကမာစတာကိုနှိပ်ပြီးအတူစတိုင်များကိုထုတ်ရှင်းလင်းပါတယ်ပြီးတာနဲ့သင့်ရဲ့ဒီဇိုင်းအပေါငျးတို့သ browser များအတွက်နေရာတစ်ခုတည်းကနေစတင်သည်။
ကမ္ဘာလုံးဆိုင်ရာ Defaults ကို
သင်၏သခင်ကိုနှိပ်ပြီးခြင်းဖြင့်စတင်ပါသင့်ပါတယ် သည့်မာဂျင်, padding တွေကများနှင့်နယ်နိမိတ်ထွက် zeroing စာမျက်နှာပေါ်မှာ။ တချို့ကက်ဘ်ဘရောက်ဇာကို browser pane ထဲကအနားကနေအသစ်မှာ 1 သို့မဟုတ် 2 pixels ကိုမှစာရွက်စာတမ်း၏ကိုယ်ကို default ။ ဤသည်ကိုသူတို့ရှိသမျှသည်အတူတူပင်ဖော်ပြရန်သေချာစေသည်:
html, body {margin: 0px; padding ကို: 0px; နယ်စပ်: 0px; }သငျသညျကိုလည်း font ကိုတသမတ်တည်းစေချင်တယ်။ သင့်ရဲ့ page ကိုလက်လှမ်းကြောင်းထိုနည်းတူ, 100 ရာခိုင်နှုန်းသို့မဟုတ် 1em ဖို့စာလုံးအရွယ်အစားကိုသတ်မှတ်ရန်သေချာစေပါ, ဒါပေမဲ့အရွယ်အစားသေးသမတ်တည်းဖြစ်ပါတယ်။ ထိုအခါလိုင်း-အမြင့်ထည့်သွင်းရန်သေချာစေပါ။
ခန္ဓာကိုယ် {font ကို: 1em / 1.25 Arial, Helvetica, sans-serif; }ခေါင်းကြီးဖောမတ်ချ
ခေါင်းကြီးသို့မဟုတ် header ကို tags များ (စသည်တို့ကို H1, H2, h3,) ပုံမှန်အားဖြင့်သူတို့ကိုလှည့်ပတ်ကြီးမားသောမာဂျင်သို့မဟုတ် padding ကိုနှင့်အတူရဲရင့်သောစာသားမှ default ။ အပိုစတိုင်များမလိုဘဲကိုယ်အလေးချိန်, မာဂျင်နှင့် padding ကိုရှင်းလင်းရေးအသုံးပြုပုံသင်တို့သည်ဤ tags များနေတုန်းပဲပိုကြီးတဲ့ (သို့မဟုတ်သေးငယ်) ကျန်ကြွင်းသောသေချာသူတို့ကိုလှည့်ပတ်စာသားထက်:
h1, h2, h3, h4, H5, h6 {margin: 0; padding ကို: 0; font-အလေးချိန်: ပုံမှန်; font-family: Arial, Helvetica, sans-serif; }သင်သည်သင်၏ခေါင်းစဉ် tags များမှတိကျတဲ့အရွယ်အစား, အက္ခရာ-Space နဲ့ padding တွေက setting ထည့်သွင်းစဉ်းစားရန်လိုလိမ့်မည်, သို့သော်တကယ်သင်ဒီဇိုင်းနေ site ၏စတိုင်လ်ပေါ်တွင်မူတည်သည်နှင့်မာစတာစတိုင်စာရွက်ထဲကထွက်ခွာသွားရပါမည်။ သင့်ရဲ့တိကျတဲ့ဒီဇိုင်းအတွက်လိုအပ်သောအဖြစ်သင်တို့သည်ဤခေါင်းစဉ်ပိုစတိုင်များထည့်သွင်းနိုင်ပါတယ်။
plain text format
ခေါင်းကြီးပိုင်းတွင်တဘက်, သငျသညျအထဲကရှင်းလင်းဖို့သေချာပါဖြစ်သင့်သည်အခြားစာသားကို tags များရှိပါသည်။ လူတွေကမကြာခဏမေ့လျော့သောတစ်ခုမှာ set ကိုစားပွဲပေါ်မှာဆဲလ် tags များ (TH နှင့် TD) နှင့်ပုံစံ tags များ (SELECT, TEXTAREA နှင့်ထည့်သွင်းမှု) ရှိပါတယ်။ သင်သည်သင်၏ခန္ဓာကိုယ်နှင့်အပိုဒ်စာသားကိုကဲ့သို့တူညီသောအရွယ်အစားရှိသူများကိုသတ်မှတ်မထားဘူးဆိုရင်, သင်က browser သူတို့ကိုဆပ်ဘယ်လောက်မှာ unpleasantly အံ့သြသွားပေမည်။
p, ကြိမ်မြောက်, td, li, dd, ၎င်းကို, ul, ol, blockquote, q, အတိုကောက်, abbr တစ်ဦး, input ကို, ကို select လုပ်ပါ, textarea {margin: 0; padding ကို: 0; ဖောင်: / 1.25 Arial, Helvetica, sans-serif ပုံမှန်သာမန်ပုံမှန် 1em; }ဒါဟာသင့်ရဲ့ကောက်နုတ်ချက် (BLOCKQUOTE နှင့်မေး) ပေးဖို့လည်းကောင်းတဲ့ရဲ့အတိုကောက်များနှင့်သူတို့တစ်တွေအနည်းငယ်ပိုထွက်မတ်တပ်ရပ်နိုင်အောင်, အနည်းငယ်အပိုစတိုင် abbreviations:
blockquote {margin: 1.25em; padding ကို: 1.25em} က q {font-style ကို: စာလုံးစောင်း; } အတိုကောက်, abbr {cursor: အကူအညီနဲ့; နယ်စပ်-အောက်ခြေ: 1px dashed; }links များနှင့်ပုံများ
links စီမံခန့်ခွဲရန်နှင့်ဖျောပွတောက်ပတဲ့အပြာရောင်စာသားကိုမျဉ်းသားကနေပြောင်းလဲပစ်ရန်လွယ်ကူပါတယ်။ အစဉ်မပြတ်ငါငါ့အလင့်များမျဉ်းသားအဖြစ်သာကျန်ရှိနေသေးကြောင်းရှိသည်ဖို့ပိုနှစ်သက်ပေမယ့်သင်ကသင်ကသီးခြားစီအဲဒီ options သတ်မှတ်နိုင်သည်ကွဲပြားခြားနားသောလမ်းပိုနှစ်သက်လျှင်။ သောဒီဇိုင်းအပျေါမှာမူတည်နေသောကြောင့်ငါသည်လည်း, သခင်စတိုင်စာရွက်ထဲမှာအရောင်တွေမပါဝင်ပါဘူး။
တစ်ဦးတစ်ဦး: link ကိုတစ်ဦး: တစ်, သွားရောက်ခဲ့ပြီး: တက်ကြွတစ်ဦး: မောက်စ်တင် {text-decoration: မဉျြးသား, အလေးအနကျပွော; }ပုံရိပ်တွေနှင့်အတူကနယ်စပ်ကို turn off လုပ်ဖို့အရေးကြီးပါတယ်။ အများဆုံး browser များတဲ့လွင်ပြင် image ကိုလှည့်ပတ်နေတဲ့နယ်စပ်ဖော်ပြရန်မလိုပေမယ့် image ကိုဆက်စပ်သည့်အခါ, ထို browser များနယ်စပ်ကိုဖွင့်။ : ဤ fix မှ
img {နယ်စပ်: none; }ဇယား
စားပွဲမရှိတော့ layout ကိုရည်ရွယ်ချက်များအတွက်အသုံးပြုကြသည်နေစဉ်, သငျသညျ site ကိုနေတုန်းပဲအမှန်တကယ် tabluar ဒေတာအဘို့ထိုသူတို့သုံးနိုင်ပါသည်။ ဤသည်က HTML စားပွဲတစ်ဒဏ်ငွေအသုံးပြုမှုဖြစ်ပါတယ်။ ကျနော်တို့ပြီးသားကို default စာသားအရွယ်အစားသင့်စားပွဲဆဲလ်များအတွက်တူညီကြောင်းကိုသေချာလုပ်ပြီးပြီ, ဒါပေမယ့်သင့်ရဲ့စားပွဲအတူတူနေဖို့နိုင်အောင်သတ်မှတ်ထားသင့်တယ်အနည်းငယ်သည်အခြားစတိုင်များရှိပါတယ်:
စားပွဲ {margin: 0; padding ကို: 0; နယ်စပ်: none; }ပုံစံများ
အခြားဒြပ်စင်များနှင့်လိုပဲ, သင်သည်သင်၏ပုံစံများကိုပတ်လည်ရှိမာဂျင်နှင့် padding တွေကထွက်ရှင်းလင်းသင့်ပါတယ်။ ငါလုပ်ဖို့ကြိုက်တယ်နောက်ထပ်အရာ "အဖြစ်ပုံစံ tag ကိုပြန်ရေးဖြစ်ပါသည် inline ကြောင့်သင်ကုဒ်အတွက် tag ကိုနေရာဘယ်မှာအပိုအာကာသ add ပါဘူးဒါကြောင့်" ။ ငါ့စာသားကို၏ကျန်ကဲ့သို့တူညီသောင်သို့မှသာအခြားစာသားဒြပ်စင်နှင့်ဝသကဲ့သို့, ငါကို select လုပ်ပါ, textarea နှင့်အထက် input ကိုတက်ဘို့ဖောင်သတင်းအချက်အလက်သတ်မှတ်။
ပုံစံ {margin: 0; padding ကို: 0; display: inline; }ဒါဟာသင့်ရဲ့တံဆိပ်များများအတွက် cursor ကိုပြောင်းလဲဖို့လည်းကောင်းတစ်စိတ်ကူးပါတယ်။ ဤလူမျိုးကိုသူတို့ကနှိပ်လျှင်တံဆိပ်တစ်ခုခုလုပ်လိမ့်မည်ဟုကြည့်ဖို့ကူညီပေးသည်။
တံဆိပ် {cursor: pointer; }ဘုံ Classes ရဲ့
မာစတာကိုနှိပ်ပြီး၏ဤအပိုငျး, သင်သတ်မှတ်သင့်တယ် အတန်း ကိုသင်သဘောမျိုးလုပ်ပါ။ ဤရွေ့ကား, ငါသည်အများဆုံးမကြာခဏအသုံးပြုအတန်းတချို့ရှိနေပါတယ်။ သင်လိုအပ်သမျှသူတို့ကို assign နိုင်အောင်, သူတို့ကမဆိုအထူးသဖြင့်ဒြပ်စင်ဟုသတ်မှတ်ကြသည်မဟုတ်ကြောင်းမှတ်ချက်:
.clear {ရှင်းရှင်းလင်းလင်း: နှစ်ဦးစလုံး; } .floatLeft {float: left; } .floatRight {float: ခွင့်, } .textLeft {text-align: left; } .textRight {text-align: ခွင့်, } .textCenter {text-align: စင်တာ; } .textJustify {text-align: တရားမျှတ; } .blockCenter {display: block ကို; margin-လက်ဝဲ: အော်တို; margin-ညာဘက်: အော်တို; } / * * / .bold {font-weight ကိုတော့အကျယ်သတ်မှတ်ထားဖို့သတိရပါ: ရဲရင့်; } .italic {font-style ကို: စာလုံးစောင်း; } .underline {text-decoration: မဉျြးသား, အလေးအနကျပွော; } .noindent {margin-လက်ဝဲ: 0; padding ကို-left: 0; } .nomargin {margin: 0; } {padding ကို .nopadding: 0; } .nobullet {list-style: none; list-style-image ကို: none; }ဤအအတန်းကိုအခြားစတိုင်များမတိုင်မီတိကျမ်းစာ၌လာသည်နှင့်သူတို့ပဲအတန်းဖြစ်ကြ၏ဘာဖြစ်လို့လဲဆိုတော့သူတို့နောက်ပိုင်းတွင်အတွက်ပေါ်ပေါက်ပိုမိုတိကျတဲ့စတိုင်ဂုဏ်သတ္တိများနှင့်အတူပယ်ဖျက်ဖို့လွယ်ကူပါတယ်ဖြစ်ကြောင်းကိုသတိရပါ အဆငျ့ဆငျ့ ။ သင်က Element အပေါ်တစ်ဦးဘုံလူတန်းစား set ကြောင့်အကျိုးသက်ရောက်မှုယူတော်မမူကြောင်းကိုရှာဖွေလျှင်, သင်အချို့သောအခြားစတိုင်ထိုဒြပ်စင်ထိခိုက်သင့်ရဲ့နောက်ပိုင်းမှာ stylesheet မှာတဦးတည်းအတွက်မရှိကြောင်းသေချာစေရန်စစ်ဆေးသင့်ပါတယ်။
တစ်ခုလုံးကိုမာစတာကိုနှိပ်ပြီး
/ * ဂလိုဘယ် Defaults ကို * / html, body {margin: 0px; padding ကို: 0px; နယ်စပ်: 0px; } body {font ကို: 1em / 1.25 Arial, Helvetica, sans-serif; } / * ခေါင်းစီးသတင်း * / h1, h2, h3, h4, H5, h6 {margin: 0; padding ကို: 0; font-အလေးချိန်: ပုံမှန်; font-family: Arial, Helvetica, sans-serif; } / * စာသား Styles * / p, ကြိမ်မြောက်, td, li, dd, ၎င်းကို, ul, ol, blockquote, q, အတိုကောက်, abbr တစ်ဦး, input ကို, ကို select လုပ်ပါ, textarea {margin: 0; padding ကို: 0; ဖောင်: / 1.25 Arial, Helvetica, sans-serif ပုံမှန်သာမန်ပုံမှန် 1em; } blockquote {margin: 1.25em; padding ကို: 1.25em} က q {font-style ကို: စာလုံးစောင်း; } အတိုကောက်, abbr {cursor: အကူအညီနဲ့; နယ်စပ်-အောက်ခြေ: 1px dashed; } သေးငယ် {font-size: .85em; } ကြီးတွေ {font-size: 1.2em; } / * Links များနှင့်ပုံများ * / တစ်ဦး, တစ်ဦး: link ကိုတစ်ဦး: တစ်, သွားရောက်ခဲ့ပြီး: တက်ကြွတစ်ဦး: မောက်စ်တင် {text-decoration: မဉျြးသား, အလေးအနကျပွော; } img {နယ်စပ်: none; } / * ဇယား * / စားပွဲပေါ်မှာ {margin: 0; padding ကို: 0; နယ်စပ်: none; } / * Form များ * / Form {margin: 0; padding ကို: 0; display: inline; } တံဆိပ် {cursor: pointer; } / * ဘုံ Classes ရဲ့ * / .clear {ရှင်းရှင်းလင်းလင်း: နှစ်ဦးစလုံး; } .floatLeft {float: left; } .floatRight {float: ခွင့်, } .textLeft {text-align: left; } .textRight {text-align: ခွင့်, } .textCenter {text-align: စင်တာ; } .textJustify {text-align: တရားမျှတ; } .blockCenter {display: block ကို; margin-လက်ဝဲ: အော်တို; margin-ညာဘက်: အော်တို; } / * * / .bold {font-weight ကိုတော့အကျယ်သတ်မှတ်ထားဖို့သတိရပါ: ရဲရင့်; } .italic {font-style ကို: စာလုံးစောင်း; } .underline {text-decoration: မဉျြးသား, အလေးအနကျပွော; } .noindent {margin-လက်ဝဲ: 0; padding ကို-left: 0; } .nomargin {margin: 0; } {padding ကို .nopadding: 0; } .nobullet {list-style: none; list-style-image ကို: none; }ဂျနီဖာ Krynin ခြင်းဖြင့်မူရင်းဆောင်းပါး။ 10/6/17 အပေါ်ဂျယ်ရမီ Girard တည်းဖြတ်