Bootstrap e-Book In Hindi

Online e-Libreary C Language

Basic Grid Structure in bootstrap :

<div class="row">

          <div class="col-*-*"></div>

          <div class="col-*-*"></div>

</div>

उपरोक्त structure में Bootstrap के basic Grid structure को बताया गया है इसमें एक <div> में एक class row add की है यह Bootstrap library की class है जिसका use कर के row क्रिएट की जाती है

तथा दूसरी class col add की गई है यह भी bootstrap library की class है जिसका use कर के कॉलम बनाए जाते है जेसा की आप जानते है की Bootstrap में एक डिवाइस स्क्रीन को 12 कॉलम में बाटा  गया है इस आधार पर col class की use किया जाता है की कितने कॉलम बनाने है जेसा की आप उपरोक्त Example में देख पा रहे है

<div class="col-*-*"></div>

 

इस div class में 2 star (*) का use किया गया है यह पहले * का मतलब यह है की आपको इस star (*) के स्थान पर यह बताना है की डिवाइस की screen size कितनी है जेसा की table 1.1 में बताया गया है अलग अलग डिवाइस के लिए अलग – अलग screen size होती है जेसा की हम उदाहरण के लिए मानते है की हमारे डिवाइस की screen size 750px है तब हम table 1.1 के अनुसार .col-sm-* class का use करेगे तथा अगला star इस बार का संकेत देता है की आपको वेब पेज पर कितने कॉलम बनाना है

1. जेसा की आप जानते है की एक वेब पेज को 12 कॉलम  डिवाइड किया गया है

2. अगर आप कहते है की आप पुरे webpage पर केवल एक ही कॉलम बनाना कहते है तो यह भी कर सकते है उसके लीये आपको निम्नलिखित statement का use करना होगा

<div class=”col-sm-12”></div>

इस statement का use कर के आप वेब पेज पर एक कॉलम create कर सकते है जो पुरे webpage को कवर करेगा

3. यदी अगर आप चाहते है की आपके webpage पर दो कॉलम है तो आप इस statement का use कर सकते है

<div class="row">

          <div class="col-sm-6"></div>

          <div class="col-sm-6"></div>

</div>

इस statement का use करने से webpage पर 2 कॉलम क्रेअती हो जाएगे
इस तरह से आप webpage की 1 से लेकर 12 के बिच जितने कॉलम  बना सकते है किन्तु इस बात का विशेष ध्यान रखे की एक रो में 12 कॉलम से ज्यादा  नहीं बनाए जा सकते है

 

अलग अलग वscreen size के लिए अलग अलग ग्रिड system के उदाहरण आगे दिए गए है 

Prv Next


.