Bootstrap 3 ကျူတိုရီရယ်

BS ပင်မစာမျက်နှာ BS ကို စတင်လိုက်ပါ။ BS Grid အခြေခံ BS စာစီစာရိုက် BS ဇယားများ BS ရုပ်ပုံများ BS Jumbotron BS ဝဲလ် BS သတိပေးချက်များ BS ခလုတ်များ BS ခလုတ်အုပ်စုများ BS Glyphicons BS တံဆိပ်များ/တံဆိပ်များ BS တိုးတက်မှုဘားများ BS Pagination BS ပေဂျာ BS စာရင်းအုပ်စုများ BS Panels များ BS Dropdowns BS ခေါက်သိမ်း BS တက်ဘ်များ/ဆေးပြားများ BS Navbar BS ပုံစံများ BS သွင်းအားစုများ BS သွင်းအားစုများ ၂ BS ထည့်သွင်းမှုအရွယ်အစား BS မီဒီယာအရာဝတ္ထုများ BS ချားရဟတ် BS Modal BS Tooltip BS Popover BS Scrollspy BS Affix BS စစ်ထုတ်မှုများ

Bootstrap Grids

BS Grid စနစ် BS Stacked/Horizontal BS Grid အသေး BS Grid Medium BS Grid အကြီး BS Grid နမူနာများ

Bootstrap အပြင်အဆင်များ

BS ပုံစံများ BS ဆောင်ပုဒ် "ရိုးရှင်းစွာ ကျွန်ုပ်" BS ဆောင်ပုဒ် "ကုမ္ပဏီ" BS Theme "Band"

Bootstrap နမူနာများ

BS နမူနာများ BS Quiz BS လေ့ကျင့်ခန်းများ BS လက်မှတ်

Bootstrap CSS Ref

CSS အတန်းအားလုံး CSS စာစီစာရိုက် CSS ခလုတ်များ CSS ပုံစံများ CSS အကူအညီပေးသူများ CSS ပုံများ CSS ဇယားများ CSS Dropdowns CSS Navs ဂလက်ဖကွန်များ

Bootstrap JS Ref

JS Affix JS သတိပေးချက် JS ခလုတ် JS ချားရဟတ် JS ခေါက်သိမ်းပါ။ JS Dropdown JS Modal JS Popover JS Scrollspy JS Tab JS Tooltip


Bootstrap တံဆိပ်များနှင့် တံဆိပ်များ


တံဆိပ်များ

တံဆိပ်များသည် လင့်ခ်တစ်ခုနှင့် ဆက်စပ်နေသည့် အရာများ မည်မျှရှိသည်ကို ကိန်းဂဏာန်းအညွှန်းများဖြစ်သည်-

သတင်း
မှတ်ချက်များ၁၀
အပ်ဒိတ်များ

နံပါတ် (၅၊ ၁၀၊ ၂) သည် တံဆိပ်များဖြစ်သည်။

တံဆိပ်များဖန်တီးရန် ဒြပ်စင် .badgeများအတွင်း အတန်း ကို အသုံးပြုပါ -<span>

ဥပမာ

<a href="#">News <span class="badge">5</span></a><br>
<a href="#">Comments <span class="badge">10</span></a><br>
<a href="#">Updates <span class="badge">2</span></a>

ခလုတ်များကဲ့သို့သော အခြားဒြပ်စင်များအတွင်းတွင်လည်း တံဆိပ်များကို အသုံးပြုနိုင်သည်။



အောက်ဖော်ပြပါ ဥပမာသည် ခလုတ်များသို့ တံဆိပ်များထည့်နည်းကို ပြသည်-

ဥပမာ

<button type="button" class="btn btn-primary">Primary <span class="badge">7</span></button>


တံဆိပ်များ

တစ်စုံတစ်ခုနှင့်ပတ်သက်သော နောက်ထပ်အချက်အလက်များကို ပေးဆောင်ရန် အညွှန်းများကို အသုံးပြုသည်-

နမူနာ အသစ်

နမူနာ အသစ်

နမူနာ အသစ်

နမူနာ အသစ်

နမူနာ အသစ်
နမူနာ အသစ်

အညွှန်းတစ်ခုဖန်တီးရန် ဒြပ်စင် တစ်ခုအတွင်း ဆက်စပ် အတန်း ခြောက်ခု အနက်မှ တစ်ခု .labelနောက်တွင် အတန်း ကိုအသုံးပြု ပါ-.label-default.label-primary.label-success.label-info.label-warning.label-danger<span>

ဥပမာ

<h1>Example <span class="label label-default">New</span></h1>
<h2>Example <span class="label label-default">New</span></h2>
<h3>Example <span class="label label-default">New</span></h3>
<h4>Example <span class="label label-default">New</span></h4>
<h5>Example <span class="label label-default">New</span></h5>
<h6>Example <span class="label label-default">New</span></h6>

အောက်ဖော်ပြပါ ဥပမာသည် အကြောင်းအရာဆိုင်ရာ အညွှန်းအတန်းများအားလုံးကို ပြသသည်-

ပုံသေ အညွှန်း ပင်မ အညွှန်း အောင်မြင်မှု အညွှန်း အချက်အလက် အညွှန်း အညွှန်း သတိပေး အညွှန်း ဘေးအန္တရာယ် အညွှန်း

ဥပမာ

<span class="label label-default">Default Label</span>
<span class="label label-primary">Primary Label</span>
<span class="label label-success">Success Label</span>
<span class="label label-info">Info Label</span>
<span class="label label-warning">Warning Label</span>
<span class="label label-danger">Danger Label</span>

လေ့ကျင့်ခန်းများဖြင့် သင့်ကိုယ်သင် စမ်းသပ်ပါ။

လေ့ကျင့်ခန်း

"မှတ်ချက်များ" စာသားပြီးနောက်၊ အတွင်းတွင် နံပါတ်နှစ်ပါသော တံဆိပ်တစ်ခုပြုလုပ်ရန် span element ကိုသုံးပါ။

<button>Comments </button>