သာ. ကြီးစတိုင်နဲ့ layout ကိုထိန်းချုပ်ဘို့ CSS နဲ့ span နှင့် div ကိုသုံးပါ။
သူတို့ကွန်ရက်စာမျက်နှာတွေထဲကအတည်ဆောက်ရန်အဖြစ်ကို web ဒီဇိုင်းနှင့် HTML / CSS ကိုအသစ်နေသောလူအတော်များများ နဲ့အပြန်အလှန်ဖလှယ်အတွက် အဆိုပါ div element ကသင်၏ဝဘ်စာမျက်နှာပေါ်တွင်ယုတ္တိကွဲပြားခြင်းသတ်မှတ်ပါတယ်။ ဒါဟာအခြေခံအားဖြင့်သင်တို့ကိုယုတ္တိနည်းအတူတူသွားရသောအခြား HTML element တွေကိုနေရာချနိုင်သည့်အတွက် box ကိုဖြစ်ပါတယ်။ တစ်ဦးကဌာနခွဲအပိုဒ်, ခေါင်းစဉ်, စာရင်းများ, link ပုံများ, စသည်တို့ကိုတူသောသူကတောင်သင့်ရဲ့ HTML ကိုစာရွက်စာတမ်းမှအပိုဆောင်းဖွဲ့စည်းပုံနဲ့အဖှဲ့အစညျးများကိုပြုလုပ်၏အတွင်းပိုင်းသည်အခြားကွဲပြားမှုရှိနိုင်ပါသည်, အထဲတွင်မျိုးစုံအခြားဒြပ်စင်ရှိနိုင်ပါသည်။ အဆိုပါ div ဒြပ်စင်ကိုသုံးပါကနောက်မှသင်သည်သီးခြားကွဲပြားခြင်းအဖြစ်လိုချင်ကြောင်းကိုသင်၏စာမျက်နှာ၏ဧရိယာရှေ့မှာပွင့်လင်း div ၏အကြောင်းအရာများကို သင့်ရဲ့ page ၏ဧရိယာကိုသင်အကြာတွင် CSS နဲ့စတိုင်အသုံးပြုလိမ့်မည်ဟုအချို့သောအပိုဆောင်းသတင်းအချက်အလက်လိုအပ်ပါတယ်လျှင်, သင်, ဥပမာ (တစ်ဦးအိုင်ဒီ selector add နိုင်ပါတယ် အိုင်ဒီ = "myDiv">), သို့မဟုတ်တစ်လူတန်းစား selector (ဥပမာ, အတန်းအစား = "bigDiv">) ။ ဤအ attribute တွေနှစ်ယောက်စလုံးထို့နောက် CSS ကိုသုံးပြီးရွေးချယ်ထားသည့်သို့မဟုတ် JavaScript ကိုသုံးပြီးပြုပြင်ထားသောနိုင်ပါသည်။ လက်ရှိအကောင်းဆုံးအလေ့အကျင့်ဖြစ်သောကြောင့်ဘယ်လောက်တိကျတဲ့ ID ကို selector တွေကို၏အစိတ်အပိုင်းအတွက်အစား၏ ID ၏အတန်းအစား selector တွေကိုသုံးပြီးဆီသို့ဦးတည်အမှီ။ အမှန်တရားအတွက်, သို့သော်, သငျသညျဖြစ်စေတဦးတည်းကိုအသုံးပြုဖို့နိုင်နှင့်ပင်ဌာနခွဲတစ်ခု ID နှင့်တစ်ဦးလူတန်းစား selector နှစ်ဦးစလုံးကိုပေးနိုင်ပါသည်။ ကပူးတွဲအကြောင်းအရာကိုမဆို semantic အဓိပ္ပာယ်ကိုမပေးပါဘူးဘာဖြစ်လို့လဲဆိုတော့ဒီ div element က HTML5 ကိုအပိုင်းဒြပ်စင်အနေဖြင့်ကွဲပြားခြားနားသည်။ : သင်အကြောင်းအရာများ၏ဘလောက်တစ်ခု div တစ်ခုသို့မဟုတ်ပုဒ်မဖြစ်သင့်သလားဆိုတာကိုသေချာမသိကြလျှင်, ဒြပ်စင်များနှင့်အကြောင်းအရာ၏ရည်ရွယ်ချက်သင်အသုံးပြုရသောဆုံးဖြတ်ကူညီရန်တွေဘာတွေရှိတယ်ဆိုတာစဉ်းစား နောက်ဆုံးတွင် divs နှင့်အပိုင်းနှစ်ခုစလုံးတော်တော်အလားတူပြုမူနှင့်သင်သည်ထိုသူတို့၏တစ်ခုခုကိုတန်ဖိုးများကို attribute နှငျ့သငျလိုအပျကွောငျးသင့် site ၏အသွင်အပြင်အရ CSS ကိုသူတို့နှင့်အတူ style ပေးနိုင်ပါသည်။ ဤအရာနှစ်ဦးစလုံးပိတ်ပင်တားဆီးမှုအဆင့်ဒြပ်စင်ဖြစ်ပါသည်။ အဆိုပါ span element ကို default အနေဖြင့်မှာ inline element ဖြစ်ပါတယ်။ ဒါကကင်း div နှင့်ပုဒ်မဒြပ်စင်ကနေသတ်မှတ်။ အဆိုပါ span element ကိုမကြာခဏပြုလုပ်အကြာတွင် style အမျိုးမျိုးရနိုင်သည့်အပိုဆောင်း "ချိတ်" ပေးစေခြင်းငှါ, အကြောင်းအရာတစ်ခုသတ်သတ်မှတ်မှတ်အပိုင်းအစ, ပုံမှန်အားဖြင့်စာသားမခြုံအသုံးပြုသည်။ CSS နဲ့သုံးအဲဒါကို encloses စာသားရဲ့ style ပြောင်းလဲနိုင်သည်; သို့သော်မည်သည့် style attribute တွေမပါဘဲ, တစ်ယောက်တည်း span ဒြပ်စင်မှာစာသားအားလုံးကိုမသက်ရောက်ပါတယ်။ ဒါက span နှင့် div element တွေအကြားအဓိကကွာခြားချက်ဖြစ်ပါတယ်။ အထက်တွင်ဖော်ပြခဲ့သည့်အတိုင်း span element ကိုသာ tags များအားဖြင့်ပူးတွဲဘာမှဆက်စပ် CSS ကိုစတိုင်စည်းမျဉ်းစည်းကမ်းတွေကိုလျှောက်ထားရန် browser ကိုပြောထားသည်သော်လည်း, ထို div ဒြပ်စင်တစ်ခုအပိုဒ်ချိုးပါဝင်သည်: Highlighted စာသားကို နဲ့ Non-မီးမောင်းထိုးပြစာသားကို။ CSS နဲ့စာသား (ဥပမာ, အတန်းအစား = "မီးမောင်းထိုးပြ">) style ဖို့ span element ကမှအတန်း = "မီးမောင်းထိုးပြ" သို့မဟုတ်အခြားလူတန်းစားထည့်ပါ။ အဆိုပါ span element ကိုအဘယ်သူမျှမလိုအပ်တဲ့ attribute တွေရှိပါတယ်, ဒါပေမယ့်အများဆုံးအသုံးဝင်ကြောင်းသုံး div element ကအဲဒီကဲ့သို့တူညီသောနေသောခေါင်းစဉ်: သငျသညျသစ်တစ်ခုအဖြစ်အကြောင်းအရာကို defining မပါဘဲအကြောင်းအရာ၏စတိုင်ကိုပြောင်းလဲလိုတဲ့အခါ span သုံးပါ ပိတ်ပင်တားဆီးမှု-Level ဒြပ်စင် စာရွက်စာတမ်း၌တည်၏။ သငျသညျအနီဖြစ်တည်ထားတဲ့ h3 ၏ဒုတိယစကားလုံးချင်တယ်ဆိုရင်ဥပမာ, သငျသညျအနီစာသားကိုအဖြစ်စကားလုံး style မယ်လို့တစ် span ဒြပ်စင်နဲ့စကားလုံးဝန်းရံနိုင်ဘူး။ အဆိုပါစကားလုံးနေဆဲ h3 ဒြပ်စင်၏အစိတ်အပိုင်းတစ်ခုဖြစ်နေဆဲပေမယ့်ယခုတွင်လည်းအနီအတွက်ဖော်ပြပေး: 2/2/17 အပေါ်ဂျယ်ရမီ Girard တည်းဖြတ်
Element ကိုအသုံးပြုခြင်း
ဤသူသည်ငါ၏ Awesome ကိုခေါင်းကြီးဖြစ်ပါသည်