bootstrap

 

 

نحوه نوشتن css – hack  برای دستگاه های مختلف :

 

مثلا فرض کنید در حالت موبایل میخواهید موقعیت یک کلاس را تغییر دهید

به شکل زیر در فایل style.css  مینویسیم :

 

چطور فاصله بین grid ها را کم و زیاد کنیم :

با دستورات margin میتوان به میزان دلخواه این فاصله ها را کم و زیاد کرد

 

کار با عکس ها 

شما می توانید برای قرار دادن عکس از تگ معمول <img src=“demo.jpg”/> استفاده کنید. برای اینکه عکس فرم جالب تری پیدا کند می توانید از کلاس هایی همچون «img-rounded» برای عکسهایی با گوشه های گرد، «img-circle» برای نمایش عکس به شکل دایره و «img-polaroid» برای کادر و سایه دادن به عکس استفاده کنید.

رنگ بندی متن 
شما می توانید رنگ های پیش فرض را برای متن پارگراف در نظر بگیرید. رنگ های مختلف را با کلاس های تعیین شده از قبیل «muted» برای خاکستری، «text-warning» برای زرد، «text-error» برای قرمز تیره، «text-info» برای آبی روشن و «text-success» برای رنگ سبز استفاده کرد.

مطالب پیشنهادی :  ۳۸ اشتباه در طراحی وب که باید از آنها بپرهیزید

ردیف کردن متن
چپ چین، راست چین و وسط چین کردن پاراگراف یا div می تواند توسط کلاس های text-right، text-left و text-center انجام شود.

 

موارد زیر را میتوان طراحی کرد با بوتسترپ :

از لینک های زیر ایستفاده کنید :

http://getbootstrap.com/2.3.2/components.html

http://getbootstrap.com/2.3.2/javascript.html

ساخت Alerts

ساخت Modal

ساخت Accordion

ساخت اسلایدر

ساخت Tooltip

ساخت Tab content

———————————————————————-

 

تغییرات مربوط  به بوتسرتپ 3 نسبت به نسخه 2.3.2 :

نکته : به کمک لینک زیر میتوان نسخه قبلی بوتسرپ را به نسخه جدید تبدیل کرد :

http://upgrade-bootstrap.bootply.com

 

How to convert from a 2.x to 3.0 grid without any responsive changes.

·  replace .span* with .col-md-*
·  replace .container-fluid with .container.

·  replace .row-fluid with .row.

 

به جای span  از col-md  استفاده شده

مثال :

Class=“Span8”   ->  class=“ col-md-8”

 

bootstrap3

 

 

 

 

 

 

 

 

 

 

 

 

 

دسته بندی‌ها:آموزش,طراحی وب

برچسب‌ها :<<,>>

دیدگاه خود را بنوبسید