बूटस्ट्रैप 3.0 ग्रिड स्पष्टीकरण

Question

क्या कोई बूटस्ट्रैप 3.0 ग्रिड सिस्टम समझा सकता है। मैं बूटस्ट्रैप v2 ग्रिड का उपयोग कर रहा हूं जिसमें कॉलम के लिए span12 के लिए सरल span1 था। अब बूटस्ट्रैप 3.0 में विभिन्न प्रकार के कॉलम आकार हैं जैसे .col- .col-sm- .col-lg-

मुझे यह उदाहरण मिला: http://examples.getbootstrap.com/grid/index.html, लेकिन इसमें कई अलग-अलग तरीके हैं, जैसे कि मैं "मिश्रित: मोबाइल और डेस्कटॉप "ग्रिड जहां .col-12 .col-lg-8 एक साथ हैं।

मुझे बूटस्ट्रैप v2 वेबसाइट पर बूटस्ट्रैप v3 वेबसाइट माइग्रेट करने की उम्मीद है, लेकिन इन परिवर्तनों को बहुत अधिक ढूंढना।

कृपया समझाएं।

संपादित करें: (। इस लेख के बाद मैं अपने प्रश्न यहाँ पूछा आया आशा है कि यह भविष्य पाठकों मदद करता है) इसके अलावा यह अच्छा समझा बूटस्ट्रैप 3 ग्रिड लेख मिला: http://blog.jetstrap.com/2013/08/bootstrap-3-grids-explained/

Answer 1

इसके बारे में बुनियादी सार यह है कि के विभिन्न पुनरावृत्तियों .col कक्षा आपको विभिन्न उपकरणों (फोन, टैबलेट, डेस्कटॉप) के लिए ग्रिड व्यवहार निर्दिष्ट करने की अनुमति देती है। तो, उदाहरण में आप .col-lg-8 के बारे में पूछ रहे हैं यह निर्दिष्ट करता है कि div को डेस्कटॉप पर 8 कॉलम लेना चाहिए जबकि .col-12 निर्दिष्ट करता है कि div को मोबाइल डिवाइस पर 12 कॉलम (पूरी पंक्ति) लेनी चाहिए। विशिष्टता का यह स्तर आपको विभिन्न स्क्रीन आकारों पर बूटरस्ट्रैप 2 के साथ सीधा नहीं था, इस पर आपकी सामग्री को कैसे नियंत्रित किया जाएगा, इस पर सटीक नियंत्रण देता है।

सामान्य रूप से मुझे यह समझने का सबसे अच्छा तरीका मिल गया है कि इनका क्या मतलब है अभ्यास में विभिन्न डिवाइस प्रकारों पर उदाहरण पृष्ठ लाने या अपनी ब्राउज़र विंडो को दोबारा आकार देने और परिणामों की तुलना करने के लिए है।

इसके अलावा, जैसा कि आपके प्रश्न पर टिप्पणियों में बताया गया है कि बूटस्ट्रैप 2 से 3 तक माइग्रेट करने का विचार जरूरी नहीं है। आप अपने मौजूदा .span* कक्षाओं को नए .col-* कक्षाओं में अपडेट करके ऐसा करने का प्रयास कर सकते हैं लेकिन अन्य विचार हैं जैसे कि आपकी मौजूदा प्रोजेक्ट निश्चित चौड़ाई या तरल पदार्थ है जो इससे समस्याएं पैदा कर सकती है। ग्रिड लेआउट के बाहर दो संस्करणों के बीच कई अन्य बदलाव हैं जो आपको समस्याएं भी दे सकते हैं।

Answer 2

चेकआउट बूटस्ट्रैप में नए ग्रिड सिस्टम पर इस उत्कृष्ट ट्यूटोरियल 3

http://www.helloerik.com/bootstrap-3-grid-introduction