ဘယ်လို CSS ကိုအမှေဥစ်အလုပ်လုပ်က်ဘ်စာရွက်စာတမ်းများအတွက်

CSS နဲ့ website တစ်ခု styling ၏အရေးပါသောအစိတ်အပိုင်းတစ်ခုအမွေ၏အယူအဆကိုနားလည်သည်။

CSS ကို အမွေဥစ္စာကိုအလိုအလျှောက်အသုံးပြုလျက်ရှိကြောင်းအိမ်ခြံမြေ၏စတိုင်လ်များကသတ်မှတ်ထားသည်။ သင်စတိုင်လ်ပိုင်ဆိုင်မှု background-color ကိုတက်ကြည့်ရှုတဲ့အခါမှာ, သင် "အမှေဥစ်" အမည်ရအပိုင်းကိုမြင်ရပါလိမ့်မယ်။ သငျသညျအများဆုံးရှိသော web designer နဲ့တူနေလျှင်သင်ကြောင်းအပိုင်းကိုလျစ်လျူရှုပါတယ်, ဒါပေမယ့်ဒါဟာရည်ရွယ်ချက်အစေခံပါဘူး။

CSS ကိုအမှေဥစ်ကဘာလဲ?

တစ်ဦးအတွက်တစ်ဦးချင်းစီဒြပ်စင် HTML ကိုစာရွက်စာတမ်း အပင်တစ်ပင်၏အစိတ်အပိုင်းတစ်ခုဖြစ်သည်နှင့်ကနဦး element ကလွဲပြီးတိုင်းဒြပ်စင်ကြောင့် encloses ကြောင့်မိဘတစ်ဦးဒြပ်စင်ရှိပါတယ်။ ကြောင်းမိဘဒြပ်စင်မှလျှောက်ထားကြသည်မည်သို့ပင်စတိုင်များသည့်ဂုဏ်သတ္တိများအမွေဆက်ခံနိုင်သူမြားမှန်လျှင်အထဲတွင်ပူးတွဲဒြပ်စင်ဖို့လျှောက်ထားနိုင်ပါသည်။

ဥပမာအောက်တွင်ဒီက HTML ကုဒ်တစ်ခု EM tag ကို enclosing တစ်ခု H1 tag ကိုရှိပါတယ်:

ဒါက Big ခေါင်းကြီး ကဖြစ်ပါတယ်

အဆိုပါ EM element က H1 ဒြပ်စင်၏ကလေးတစ်ဦးဖြစ်ပြီး, အမွေဆက်ခံသော H1 အပေါ်တစ်စုံတစ်ရာစတိုင်များအဖြစ်ကောင်းစွာ EM စာသားကိုမှအပေါ်လွန်ပါလိမ့်မည်။ ဥပမာ:

h1 {font-size: 2em; }

font-size ကိုပိုင်ဆိုင်မှုအမွေဆက်ခံဖြစ်ပါတယ်ကတည်းက (ထို EM tags များအတွင်း၌ပူးတွဲဘာဖြစ်သည့်) "Big" ပြောပါတယ်သောစာသား H1 ၏ကျန်ကဲ့သို့တူညီသောအရွယ်အစားရှိလိမ့်မည်။ က CSS ကိုပိုင်ဆိုင်မှုအတွက်သတ်မှတ်ထားတန်ဖိုးအမွေထားလို့ဖြစ်ပါတယ်။

CSS ကိုအမှေဥစ်အသုံးပြုနည်းကိုဘယ်လို

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

ဒီသုံးစွဲဖို့အကောင်းဆုံးနည်းလမ်း BODY ကဲ့သို့အလွန်အဆင့်မြင့်ဒြပ်စင်ပေါ်တွင်သင်၏အခြေခံစတိုင်များသတ်မှတ်ထားရန်ဖြစ်ပါသည်။ သင်သည်သင်၏သတ်မှတ်လျှင် font-family ခန္ဓာကိုယ်ပိုင်ဆိုင်မှုအပေါ်ဖြစ်လျှင်, အမွေဥစ္စာကိုကျေးဇူးတင်တစ်ခုလုံးကိုစာရွက်စာတမ်းထိုနေ့ font-family စောင့်ရှောက်မည်။ ဒါဟာအမှန်တကယ်နည်းပါးလာခြုံငုံစတိုင်များရှိပါတယ်ဘာဖြစ်လို့လဲဆိုတော့စီမံခန့်ခွဲရန်ပိုမိုလွယ်ကူဖြစ်ကြောင်းသေးငယ် Stylesheets ဘို့လုပ်ပါလိမ့်မယ်။ ဥပမာ:

ခန္ဓာကိုယ် {font-family: Arial, sans-serif; }

အမွေခံရသောစတိုင် Value ကိုသုံးပါ

တိုင်း CSS ကိုပိုင်ဆိုင်မှုတစ်ခုဖြစ်နိုင်သော option ကိုအဖြစ်တန်ဖိုး "အမွေခံ" ပါဝင်သည်။ ဒါဟာအိမ်ခြံမြေပုံမှန်အားဖြင့်အမွေဆက်ခံလိမ့်မည်မဟုတ်ပင်လျှင်, မိဘကဲ့သို့တူညီသောတန်ဖိုးကိုရှိသင့်ကြောင်း, ထိုက်ဘ်ဘရောက်ဇာကိုပြောပြသည်။ သငျသညျထိုကဲ့သို့သောအမွေဆက်ခံမရသောအနားသတ်အဖြစ်စတိုင်သတ်မှတ်ထားလျှင်, သင်ကသူတို့ကိုမိဘကဲ့သို့တူညီသောအနားသတ်ပေးဖို့နောက်ဆက်တွဲဂုဏ်သတ္တိများအပေါ်အမွေခံတန်ဖိုးကိုကိုသုံးနိုင်သည်။ ဥပမာ:

ခန္ဓာကိုယ် {margin: 1em; } p {margin: ကိုအမွေ; }

အမွေဥစ္စာကိုကွန်ပျူတာကတန်ဖိုးများကိုအသုံးပြုမည်

ဒီအမွေဆက်ခံဘို့အရေးကြီးပါတယ် ဖောင်အရွယ်အစားတူသောတန်ဖိုးများကို အရှည်ကိုအသုံးပြု။ ကွန်ပျူတာတစ်လုံးတန်ဖိုးက Web စာမျက်နှာပေါ်တွင်အချို့နဲ့အခြားတန်ဖိုးဆွေမျိုးကြောင်းကိုတန်ဖိုးဖြစ်ပါတယ်။

သင်သည်သင်၏ BODY ဒြပ်စင်အပေါ် 1em တစ် font-size ကိုသတ်မှတ်ပါက, သင့်တစ်ခုလုံးကိုစာမျက်နှာအရွယ်အစားအားလုံးသာ 1em လိမ့်မည်မဟုတ်ပေ။ ခေါင်းစဉ် (H1-h6) နှင့်အခြားကဲ့သိုသောဒြပ်စင်ဖြစ်သောကြောင့်ဤသူကားအ element တွေ (အချို့ browser များကွဲပြားခြားနားစားပွဲပေါ်မှာဂုဏ်သတ္တိများတွက်ချက်) ကိုကို Web browser ထဲမှာဆွေမျိုးအရွယ်အစားရှိသည်။ သည်အခြားစာလုံးအရွယ်အစားအချက်အလက်များ၏မရှိခြင်းမှာ Web browser ကိုအမြဲဒီတော့အပေါ် H2 အားဖြင့်နောက်တော်သို့လိုက်ကာ H1 ခေါင်းစဉ်စာမျက်နှာပေါ်တွင်အကြီးဆုံးစာသား, စေပါလိမ့်မယ်။ သင်တစ်ဦးသတ်သတ်မှတ်မှတ်စာလုံးအရွယ်အစားရန်သင့် BODY ဒြပ်စင်ထားသောအခါ, ထို့နောက်သော "ပျမ်းမျှအား" စာလုံးအရွယ်အစားအဖြစ်အသုံးပြုသည်နှင့်ခေါင်းစဉ်ဒြပ်စင်မှတွက်ချက်နေကြသည်။

အမှေဥစ်နှင့်နောက်ခံသမိုင်း Properties ကိုအကြောင်းတစ်ဦးကမှတ်ချက်

အဲဒီမှာစာရင်းဖြစ်ကြောင်းစတိုင်များတစ်အရေအတွက် W3C အပေါ် CSS ကို 2 မှာအမွေဆက်ခံမမူသော်လည်း, က်ဘ်ဘရောက်ဇာနေဆဲတန်ဖိုးများကိုအမွေခံရ။ ဥပမာအားဖြင့်, သင်သည်အောက်ပါ HTML နဲ့ CSS ကိုရေးသားခဲ့သည်လျှင်:

<စတိုင်အမျိုးအစား = "စာသားကို / css"> h1 {background-color: အဝါရောင်; }

ဒါက Big ခေါင်းစဉ် ကဖြစ်ပါတယ်

အဆိုပါစကားလုံးက "Big" နေဆဲ background-color property ကိုအမွေဆက်ခံခံရဖို့ထင်မထားဘူးသော်လည်း, အဝါရောင်နောက်ခံရှိလိမ့်မယ်။ တစ်ဦးနောက်ခံပိုင်ဆိုင်မှု၏ကနဦးတန်ဖိုးကို "ပွင့်လင်း" ဖြစ်ပါတယ်ထားလို့ဖြစ်ပါတယ်။ ဒါကြောင့်သင် အပေါ်နောက်ခံအရောင်သွားတယ်ဆိုတာမတွေ့ရပါဘူးမဟုတ်ဘဲကြောင့်အရောင်

မိဘကနေမှတဆင့်ထွန်းလင်းနေသည်။