ပုံမှန်စီးဆင်းမှု element တွေကိုအများဆုံးအခြေအနေဝဘ်စာမျက်နှာတွင်ပြသသောလမ်းဖြစ်၏။ HTML မှာအားလုံး element တွေကို inline သေတ္တာများသို့မဟုတ်ဖြစ်စေနေသောအတွင်းပိုင်းသေတ္တာများဖြစ်ကြသည် ပိတ်ပင်တားဆီးမှု သေတ္တာများ။
Block ကိုသေတ္တာထဲကတင်သော
ပုံမှန်စီးဆင်းမှုအတွက်, ပိတ်ပင်တားဆီးမှုသေတ္တာများ (ထိုနိုင်ရန်အတွက်သူတို့၌ရေးထားလျက်ရှိ၏နေအခြားနောက်စာမျက်နှာတစ်ခုပေါ်တွင်နေရာယူထားကြသည် HTML ကို ) ။ သူတို့ဟာပါဝင်တဲ့ box ရဲ့အထက်လက်ဝဲအတွက်စတင်အောက်ခြေထိပ်မှသီးနှံများကိုပုံ။ အသီးအသီးသေတ္တာအကြားအကွာအဝေးအပေါ်နဲ့အောက် margin အချင်းချင်းတယောက်ကိုတယောက်သို့ပြိုလဲအတူ margin ကသတ်မှတ်ထားသည်။
ဥပမာအားဖြင့်, သင်သည်အောက်ပါ HTML ကိုရှိစေခြင်းငှါ:
ဒါကပထမဦးဆုံး div ဖြစ်ပါတယ်။ အဲဒါကိုပတ်လည် 5px အနားသတ်တွေနဲ့ 200 pixels ကိုကျယ်ပြန့်ပါတယ်။
ဒါကပိုမိုကျယ်ပြန် div ဖြစ်ပါတယ်။
ဒါကဒုတိယတစျခုထက်နည်းနည်းကျယ်ပြန့်ဖွင့်မယ့် div ဖြစ်ပါတယ်။
တစ်ခုချင်းစီကို div တစ်ခုပိတ်ပင်တားဆီးမှု element ဖြစ်ပါတယ်, ဒါကြောင့်ယခင်ပိတ်ပင်တားဆီးမှုဒြပ်စင်အောက်တွင်ဖော်ပြထားသောနေရာချပါလိမ့်မည်။ တစ်ခုချင်းစီကို left ပြင်အစွန်းပါဝင်တဲ့ block ၏ဘယ်ဘက်အစွန်ထိမခိုက်ပါလိမ့်မယ်။
Inline သေတ္တာထဲကတင်သော
inline သေတ္တာများအခြားပြီးနောက်တစ်ဦးကွန်တိန်နာဒြပ်စင်ရဲ့ထိပ်မှာစတင်, အလျားလိုက်စာမျက်နှာပေါ်ထွက်ချထားလျက်ရှိသည်။ တဦးတည်းလိုင်းပေါ် inline သေတ္တာအပေါငျးတို့သ element တွေကို fit ရန်လုံလောက်သောအာကာသမရှိတဲ့အခါသူတို့ကလာမယ့်မျဉ်းကြောင်းမှခြုံနှင့်ထိုအရပ်မှဒေါင်လိုက်သီးနှံများကိုပုံ။
ဥပမာအားဖြင့်, အောက်ပါ HTML မှာ:
ဤသည်ကိုစာသားရဲရင့်သည်နှင့်ဒီစာသားကိုစာလုံးစောင်းဖြစ်ပါတယ်။ နှင့်ဤစာသားဖြစ်ပါတယ်။
အဆိုပါအပိုဒ်တစ်ပိတ်ပင်တားဆီးမှု element ဖြစ်ပါတယ်, ဒါပေမယ့် 5 inline element တွေရှိပါတယ်:
- "ဒီစာသားအတွက်ဖြစ်ပါတယ်"
- "ရဲရင့်"
- "နှင့်ဤစာသားကိုဖြစ်ပါတယ်"
- "စာလုံးစောင်း"
- "။ ဤစာသားဖြစ်ပါတယ်။ "
ဒါကြောင့်ပုံမှန်စီးဆင်းမှုသည်ဤဘလောက်နှင့် inline element တွေကိုဝဘ်ဒီဇိုင်နာများကမည်သည့်ဝင်ရောက်စွက်ဖက်မှုမပါဘဲဝဘ်စာမျက်နှာပေါ်တွင်ပြသပေးမှာဘယ်လိုဖြစ်ပါသည်။
သငျသညျက Element စာမျက်နှာပေါ်ရှိရာထိခိုက်စေလိုလျှင်သင်သည် CSS ကို positioning ကိုသို့မဟုတ်သုံးနိုငျ CSS ကို float ။