बूस्ट्रैप 5 लोडर
- पिछला पृष्ठ BS5 प्रगति गणना
- अगला पृष्ठ BS5 पेजिंग
लोडर
spinner/लोडर बनाने के लिए इस्तेमाल करें: .spinner-border
श्रेणी:
उदाहरण
<div class="spinner-border"></div>
रंगीन लोडर
किसी भी रंग का टेक्स्ट उपयोग करके spinner को रंग जोड़ें:
उदाहरण
<div class="spinner-border text-muted"></div> <div class="spinner-border text-primary"></div> <div class="spinner-border text-success"></div> <div class="spinner-border text-info"></div> <div class="spinner-border text-warning"></div> <div class="spinner-border text-danger"></div> <div class="spinner-border text-secondary"></div> <div class="spinner-border text-dark"></div> <div class="spinner-border text-light"></div>
विकसित लोडर
यदि आप spinner/लोडर को 'घूमने' के बजाय 'विकसित' करना चाहते हैं, तो इसे इस्तेमाल करें: .spinner-grow
श्रेणी:
उदाहरण
<div class="spinner-grow text-muted"></div> <div class="spinner-grow text-primary"></div> <div class="spinner-grow text-success"></div> <div class="spinner-grow text-info"></div> <div class="spinner-grow text-warning"></div> <div class="spinner-grow text-danger"></div> <div class="spinner-grow text-secondary"></div> <div class="spinner-grow text-dark"></div> <div class="spinner-grow text-light"></div>
लोडर आकार
कृपया इस्तेमाल करें .spinner-border-sm
या .spinner-grow-sm
छोटे लोडर बनाएं:
उदाहरण
<div class="spinner-border spinner-border-sm"></div> <div class="spinner-grow spinner-grow-sm"></div>
लोडर बटन
आप बटन पर भी लोडर जोड़ सकते हैं, चाहे उसमें टेक्स्ट हो या नहीं:
उदाहरण
<button class="btn btn-primary"> <span class="spinner-border spinner-border-sm"></span> </button> <button class="btn btn-primary"> <span class="spinner-border spinner-border-sm"></span> लोडिंग.. </button> <button class="btn btn-primary" disabled> <span class="spinner-border spinner-border-sm"></span> लोडिंग.. </button> <button class="btn btn-primary" disabled> <span class="spinner-grow spinner-grow-sm"></span> लोडिंग.. </button>
- पिछला पृष्ठ BS5 प्रगति गणना
- अगला पृष्ठ BS5 पेजिंग