آموزش های کوچک » نتایج بزرگ همراه با آموزش فارسی

Twitter Bootstrap Grid System

bootstrap-responsive-front-end-framework

Twitter Bootstrap Grid System

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

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

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

HC20XHO0V6NP 300x190 - Twitter Bootstrap Grid System

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

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

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

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

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

 

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

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

 

آموزش فارسی

تیم آموزش فارسی تمامی تلاش خود را در راستای رضایت و بالابردن علم و دانش شما عزیزان به کار می برد تا ذره کوچک برای جبران اعتماد و قدردانی شما کاربران گرامی باشد پس در این راه با اشتراک گذاری مطالب این سایت در شبکه های اجتماعی خودتان همچنین با ارسال نظرات و انتقادات خود ما را یاری رسانید...

نوشته‌های مرتبط

قوانین ارسال دیدگاه

  • چنانچه دیدگاهی توهین آمیز باشد و متوجه اشخاص مدیر، نویسندگان و سایر کاربران باشد تایید نخواهد شد.
  • چنانچه دیدگاه شما جنبه ی تبلیغاتی داشته باشد تایید نخواهد شد.
  • چنانچه از لینک سایر وبسایت ها و یا وبسایت خود در دیدگاه استفاده کرده باشید تایید نخواهد شد.
  • چنانچه در دیدگاه خود از شماره تماس، ایمیل و آیدی تلگرام استفاده کرده باشید تایید نخواهد شد.
  • چنانچه دیدگاهی بی ارتباط با موضوع آموزش مطرح شود تایید نخواهد شد.
دیدگاه‌ها

*
*

تخفیف 30%
کد تخفیف 75%
کد تخفیف 100%
تخفیف 50%
دانلود مقاله اشتباهات هزینه دار سئو SEO
کد تخفیف 13%
کد تخفیف 20%
کد تخفیف 90%
شانس خود را برای دریافت جایزه دریافت کنید!
آدرس ایمیل و تلفن همراه خود را وارد کنید و چرخ را چرخانید. این شانس شما برای به دست آوردن تخفیف های شگفت انگیز است!