बूटस्ट्रैप 4 अलर्ट

❮ पहले का अगला ❯

बूटस्ट्रैप 4 अलर्ट

बूटस्ट्रैप 4 पूर्वनिर्धारित अलर्ट संदेश बनाने का एक आसान तरीका प्रदान करता है:

सफलता! यह अलर्ट बॉक्स एक सफल या सकारात्मक कार्रवाई का संकेत देता है।

जानकारी! यह अलर्ट बॉक्स एक तटस्थ सूचनात्मक परिवर्तन या कार्रवाई को इंगित करता है।

चेतावनी! यह अलर्ट बॉक्स एक चेतावनी को इंगित करता है जिस पर ध्यान देने की आवश्यकता हो सकती है।

खतरा! यह अलर्ट बॉक्स खतरनाक या संभावित रूप से नकारात्मक कार्रवाई का संकेत देता है।

मुख्य! यह अलर्ट बॉक्स एक महत्वपूर्ण क्रिया को इंगित करता है।

माध्यमिक! यह अलर्ट बॉक्स एक कम महत्वपूर्ण क्रिया को इंगित करता है।

अंधेरा! डार्क ग्रे अलर्ट बॉक्स।

रोशनी! लाइट ग्रे अलर्ट बॉक्स।

अलर्ट .alertवर्ग के साथ बनाए जाते हैं, उसके बाद प्रासंगिक वर्गों में से एक .alert-success, .alert-info, .alert-warning, .alert-danger, .alert-primary, .alert-secondary, .alert-lightया .alert-dark:

उदाहरण

<div class="alert alert-success">
<strong>Success!</strong> Indicates a successful or positive action.
</div>

अलर्ट लिंक

alert-link"मिलते-जुलते रंगीन लिंक" बनाने के लिए अलर्ट बॉक्स के अंदर किसी भी लिंक में क्लास जोड़ें :

सफलता! आपको यह संदेश पढ़ना चाहिए ।

जानकारी! आपको यह संदेश पढ़ना चाहिए ।

चेतावनी! आपको यह संदेश पढ़ना चाहिए ।

खतरा! आपको यह संदेश पढ़ना चाहिए ।

मुख्य! आपको यह संदेश पढ़ना चाहिए ।

माध्यमिक! आपको यह संदेश पढ़ना चाहिए ।

अंधेरा! आपको यह संदेश पढ़ना चाहिए ।

रोशनी! आपको यह संदेश पढ़ना चाहिए ।

उदाहरण

<div class="alert alert-success">
<strong>Success!</strong> You should <a href="#" class="alert-link">read this message</a>.
</div>

क्लोजिंग अलर्ट

× मुझे बंद करने के लिए दाईं ओर "x" चिह्न पर क्लिक करें।

अलर्ट संदेश को बंद करने के .alert-dismissible लिए, अलर्ट कंटेनर में एक वर्ग जोड़ें। फिर जोड़ें class="close"और data-dismiss="alert" एक लिंक या एक बटन तत्व (जब आप इस पर क्लिक करते हैं तो अलर्ट बॉक्स गायब हो जाएगा)।

उदाहरण

<div class="alert alert-success alert-dismissible">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>Success!</strong> Indicates a successful or positive action.
</div>

युक्ति: × (×) एक HTML इकाई है जो "x" अक्षर के बजाय क्लोज बटन के लिए पसंदीदा आइकन है।

सभी HTML निकायों की सूची के लिए, हमारे HTML निकाय संदर्भ पर जाएं .

एनिमेटेड अलर्ट

× मुझे बंद करने के लिए दाईं ओर "x" चिह्न पर क्लिक करें। मैं "फीका" हो जाऊंगा।

.fadeचेतावनी संदेश बंद करते समय और कक्षाएं .showएक लुप्त होती प्रभाव जोड़ती हैं:

उदाहरण

पूर्ण बूटस्ट्रैप 4 अलर्ट संदर्भ

सभी अलर्ट विकल्पों, विधियों और घटनाओं के संपूर्ण संदर्भ के लिए, हमारे बूटस्ट्रैप 4 जेएस अलर्ट संदर्भ पर जाएं ।

❮ पहले का अगला ❯

बूटस्ट्रैप 4 ट्यूटोरियल

बूटस्ट्रैप 4 ग्रिड

बूटस्ट्रैप 4 अन्य

बूटस्ट्रैप 4 रेफरी

बूटस्ट्रैप 4 अलर्ट