बूटस्ट्रैप अलर्ट
अलर्ट
बूटस्ट्रैप पूर्वनिर्धारित अलर्ट संदेश बनाने का एक आसान तरीका प्रदान करता है:
अलर्ट .alert
कक्षा के साथ बनाए जाते हैं, उसके बाद चार प्रासंगिक वर्गों में से .alert-success
एक .alert-info
, .alert-warning
या
.alert-danger
:
उदाहरण
<div class="alert alert-success">
<strong>Success!</strong> Indicates a successful or positive action.
</div>
<div class="alert alert-info">
<strong>Info!</strong> Indicates a neutral informative change or action.
</div>
<div class="alert alert-warning">
<strong>Warning!</strong> Indicates a warning that might need attention.
</div>
<div class="alert alert-danger">
<strong>Danger!</strong> Indicates a dangerous or potentially negative action.
</div>
अलर्ट लिंक
alert-link
"मिलते-जुलते रंगीन लिंक" बनाने के लिए अलर्ट बॉक्स के अंदर किसी भी लिंक में क्लास जोड़ें :
उदाहरण
<div class="alert alert-success">
<strong>Success!</strong> You should <a href="#" class="alert-link">read this message</a>.
</div>
क्लोजिंग अलर्ट
अलर्ट संदेश को बंद करने के .alert-dismissible
लिए, अलर्ट कंटेनर में एक वर्ग जोड़ें। फिर जोड़ें class="close"
और data-dismiss="alert"
एक लिंक या एक बटन तत्व (जब आप इस पर क्लिक करते हैं तो अलर्ट बॉक्स गायब हो जाएगा)।
उदाहरण
<div class="alert alert-success alert-dismissible">
<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
<strong>Success!</strong> Indicates a successful or positive action.
</div>
aria-* विशेषता और × स्पष्टीकरण
स्क्रीन रीडर का उपयोग करने वाले लोगों की पहुंच में सुधार करने में सहायता के लिए, आपको बंद करें बटन बनाते समय aria-label="close" विशेषता शामिल करनी चाहिए।
और समय; (×) एक HTML इकाई है जो "x" अक्षर के बजाय क्लोज बटन के लिए पसंदीदा आइकन है।
सभी HTML निकायों की सूची के लिए, हमारे HTML निकाय संदर्भ पर जाएं .
एनिमेटेड अलर्ट
.fade
चेतावनी संदेश बंद करते समय और कक्षाएं .in
एक लुप्त होती प्रभाव जोड़ती हैं:
उदाहरण
<div class="alert alert-danger fade in">
पूर्ण बूटस्ट्रैप अलर्ट संदर्भ
सभी अलर्ट विकल्पों, विधियों और घटनाओं के संपूर्ण संदर्भ के लिए, हमारे बूटस्ट्रैप जेएस अलर्ट संदर्भ पर जाएं ।