Bootstrap 5 मेडल
- पिछला पृष्ठ BS5 बटन समूह
- अगला पृष्ठ BS5 प्रगति टेक
चिह्न
चिह्न (बैज) को सामग्री में अतिरिक्त सूचना जोड़ने के लिए उपयोग किया जाता है:
में <span>
तत्व में .badge
क्लास और परिप्रेक्ष्य क्लास (जैसे .bg-secondary
आयताकार चिह्न बनाने के लिए)।कृपया ध्यान दें कि चिह्न पैर तत्व के आकार के अनुसार आकार पकड़ता है (अगर हो):
उदाहरण
<h1>उदाहरण शीर्षक <span class="badge bg-secondary">नया</span></h1> <h2>उदाहरण शीर्षक <span class="badge bg-secondary">नया</span></h2> <h3>उदाहरण शीर्षक <span class="badge bg-secondary">नया</span></h3> <h4>उदाहरण शीर्षक <span class="badge bg-secondary">नया</span></h4> <h5>उदाहरण शीर्षक <span class="badge bg-secondary">नया</span></h5> <h6>उदाहरण शीर्षक <span class="badge bg-secondary">नया</span></h6>
परिप्रेक्ष्य चिह्न
किसी भी परिप्रेक्ष्य वर्ग का उपयोग करें (.bg-*
) चिह्न का रंग बदलने के लिए:
उदाहरण
<span class="badge bg-primary">मुख्य</span> <span class="badge bg-secondary">द्वितीयक</span> <span class="badge bg-success">सफल</span> <span class="badge bg-danger">खतरा</span> <span class="badge bg-warning">चेतावनी</span> <span class="badge bg-info">सूचना</span> <span class="badge bg-light">हल्का</span> <span class="badge bg-dark">गहरा</span>
कैप्सुल बैज
का उपयोग करें .rounded-pill
बैज को गोल बनाने वाली वर्ग:
उदाहरण
<span class="badge rounded-pill bg-primary">मुख्य</span> <span class="badge rounded-pill bg-secondary">अनुसूचित</span> <span class="badge rounded-pill bg-success">सफलता</span> <span class="badge rounded-pill bg-danger">खतरा</span> <span class="badge rounded-pill bg-warning">चेतावनी</span> <span class="badge rounded-pill bg-info">सूचना</span> <span class="badge rounded-pill bg-light">हल्का</span> <span class="badge rounded-pill bg-dark">गहरा</span>
एलिमेंट के अंदर बैज
बटन के अंदर बैज का उदाहरण:
उदाहरण
<button type="button" class="btn btn-primary"> संदेश <span class="badge bg-danger">4</span> </button>
- पिछला पृष्ठ BS5 बटन समूह
- अगला पृष्ठ BS5 प्रगति टेक