بوٽ اسٽريپ گرڊ جا مثال

بنيادي گرڊ ترتيبون توهان کي بوٽ اسٽريپ گرڊ سسٽم اندر تعمير ڪرڻ کان واقف ڪرڻ لاءِ.

ٽي برابر ڪالمن

حاصل ڪريو ٽي برابر ويڪرو ڪالمن ڊيسڪٽاپس تي شروع ٿيندڙ ۽ وڏي ڊيسڪ ٽاپ تي اسڪيلنگ . موبائيل ڊوائيسز تي، ٽيبلٽس ۽ هيٺيان، ڪالمن پاڻمرادو اسٽيڪ ٿي ويندا.

col-md-4
col-md-4
col-md-4

ٽي غير مساوي ڪالمن

ڊيسڪٽاپس تي شروع ٿيندڙ ٽي ڪالمن حاصل ڪريو ۽ مختلف ويڪر جي وڏي ڊيسڪٽاپس تائين اسڪيلنگ ڪريو. ياد رکو، گرڊ ڪالمن کي هڪ افقي بلاڪ لاء ٻارهن تائين شامل ڪرڻ گهرجي. ان کان وڌيڪ، ۽ ڪالمن کي اسٽيڪ ڪرڻ شروع ڪيو ويو آهي، ڏسڻ واري پورٽ جي ڪا به اهميت ناهي.

col-md-3
col-md-6
col-md-3

ٻه ڪالمن

ڊيسڪٽاپس تي شروع ٿيندڙ ٻه ڪالمن حاصل ڪريو ۽ وڏي ڊيسڪ ٽاپ تي اسڪيلنگ ڪريو .

col-md-8
col-md-4

مڪمل ويڪر، اڪيلو ڪالمن

مڪمل چوٽي عناصر لاءِ گرڊ ڪلاس ضروري نه آھن.

ٻه ڪالمن سان گڏ ٻه نيسٽ ٿيل ڪالمن

دستاويزن جي مطابق، nesting آسان آهي - صرف ڪالمن جي هڪ قطار کي موجوده ڪالمن ۾ رکو. هي توهان کي ڏي ٿو ٻه ڪالم شروع ٿيندڙ ڊيسڪٽاپس تي ۽ وڏي ڊيسڪ ٽاپ تي اسڪيلنگ ، ٻئي ٻه (برابر ويڪر) وڏي ڪالمن ۾.

موبائيل ڊيوائس جي سائيز، ٽيبليٽس ۽ هيٺ، اهي ڪالمن ۽ انهن جي نيسٽ ٿيل ڪالمن کي اسٽيڪ ڪندو.

col-md-8
col-md-6
col-md-6
col-md-4

مخلوط: موبائل ۽ ڊيسڪ ٽاپ

Bootstrap 3 گرڊ سسٽم ۾ چار درجا طبقا آهن: xs (فون)، ايس ايم (ٽيبلٽس)، ايم ڊي (ڊيسڪ ٽاپ)، ۽ ايل جي (وڏي ڊيسڪ ٽاپ). وڌيڪ متحرڪ ۽ لچڪدار ترتيب ٺاهڻ لاءِ توهان انهن طبقن جي تقريبن ڪنهن به ميلاپ کي استعمال ڪري سگهو ٿا.

طبقن جي هر درجي کي ماپ ڪري ٿو، مطلب ته جيڪڏهن توهان xs ۽ sm لاءِ ساڳي ويڪر کي ترتيب ڏيڻ جو منصوبو ٺاهيو ٿا، توهان کي صرف xs جي وضاحت ڪرڻ جي ضرورت آهي.

.col-xs-12 .col-md-8
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
col-xs-6
col-xs-6

مخلوط: موبائل، ٽيبليٽ، ۽ ڊيسڪ ٽاپ

.col-xs-12 .col-sm-6 .col-lg-8
.col-xs-6 .col-lg-4
.col-xs-6 .col-sm-4
.col-xs-6 .col-sm-4
.col-xs-6 .col-sm-4

ڪالمن صاف ڪرڻ

مخصوص بريڪ پوائنٽس تي فلوٽس صاف ڪريو ته جيئن اڻ برابري واري مواد سان بيوقوف لفافي کي روڪيو وڃي.

.col-xs-6 .col-sm-3
پنھنجي وييو پورٽ کي ري سائز ڪريو يا مثال طور پنھنجي فون تي ان کي چيڪ ڪريو.
.col-xs-6 .col-sm-3
.col-xs-6 .col-sm-3
.col-xs-6 .col-sm-3

آفسيٽ، ڌڪ، ۽ پل ريٽ سيٽ ڪريو

مخصوص وقفي پوائنٽن تي آف سيٽ، ڌڪ، ۽ ڇڪڻ کي ري سيٽ ڪريو.

.col-sm-5 .col-md-6
col-sm-5 .col-sm-offset-2 .col-md-6 .col-md-offset-0
.col-sm-6 .col-md-5 .col-lg-6
col-sm-6 .col-md-5 .col-md-offset-2 .col-lg-6 .col-lg-offset-0