Twitter Bootstrap Grid System

Twitter Bootstrap Grid System

 

سیستم گرید تویتر بوت استرپ راحت ترین و سریعترین راه برای ایجاد Layout می باشد.

 

چگونه با سیستم گرید تویتر بوت استرپ Layout ایجاد کنیم:

این برنامه آسانترین و سریعترین راه را برای ایجاد Layout در صفحات وب ارائه می دهد. برخلاف سیستم گرید قبلی که به طور پیش فرض ثابت می باشد، ورژن جدید آن، به عنوان مثال تویتر بوت استرپ ،۱ اولین سیستم گرید جاری را به همراه پاسخگو معرفی می کند که به طور متناسب با افزایش دستگاه، تعداد ستون ها را تا ۱۱ افزایش می دهد. تویتر بوت استرپ ۱ دارای گروه های گرید از پیش تعریف شده می باشد تا هرچه سریعتر Layout های گرید برای انواع مختلف دستگاه ها بسازد، دستگاه هایی مانند تلفن همراه، تبلت، دسکتاپ و غیره.

 

مثال کد بوت استرپ :

شما می توانید از گروه – ، col-xs برای ایجاد ستون برای دستگاه های فوق العاده کوچک مانند تلفن همراه استفاده کنید، به طور مشابه گروه – ، col-sm برای دستگاه هایی با صفحات کوچ مثل تبلت ها و -، col-md برای دستگاه هایی با اندازه متوسط مثل صفحه ی دستک تاپ و – ، col-lg برای صفحات بزرگ به کار می روند.

جدول زیر برخی از ویژگی های مهم سیستم گرید جدید را خلاصه کرده است.

 

جدول ریسپانسیو بوت استرپ :

 

جدول بالا یک نکته ی مهم را توضیح می دهد ، به کار بردن هرکدام از گروه های – col-sm برای یک عنصر نه تنها بر روی طراحی آن در دستگاه های کوچک مانند تبلت ها تاثیر خواهد گذاشت بلکه در دستگاه های بزرگتر نیز اگر گروه col-lg وجود نداشته باشد، تاثیر خواهد داشت.

 

 

 

در ادامه با آموزش چگونگی ایجاد Layout با گرید سیستم تویتر بوت استرپ ۳ با ما همراه باشید…..

 

هر روز با آموزش های متفاوت و جالب و جذاب با ما همراه باشید …… در صورت رضایت از مطالب ما به اشتراک بگذارید تا دنیای هوشمندتری داشته باشیم…….