CSS AND BOOTSTRAP

CSS AND BOOTSTRAPSAJAD ALISHAHNEJAD – ALI AKBARI BOROUMANDINTERNET ENGINEERING – KHAJE NASIR UNIVERSITY OF TECHNOLOGY - 2014

CSSو فریمورک ها

قدرت زیادی نهفته است.CSSدر •در بسیاری از سایت ها قسمت هایی مشابه وجود دارد که نیازی نیست دوباره نوشته •

شود.فریمورک های قوی و تست شده و کامل وجود دارد که کار ما را سریع و آسان می کند.•حتی از نوشتن خودمان هم می توان بهتر باشد.•

BOOTSTRAP

• Bootstrap توسط یک گروه کوچک در شرکتTwitter نوشته شده. 2011 در سال (Mark Otto و Jacob Thornton)

است.GitHubهم اکنون محبوب ترین پروژه در سایت •% سایت های جهان استفاده می شود.1در •

BOOTSTRAPمزایای

Provides a clean and uniform solution for building an interface for developers.

User Interface Framework )JS, CSS and Images( Open Source project Supports all major browsers incl. IE7 Supports HTML5 and CSS3 Beautiful and functional built-in components which are easy to

customise

BOOTSTRAPامکانات

ScaffoldingGlobal styles for the body to reset type and background, link styles, grid system, and

two simple layouts. Base CSS

Styles for common HTML elements like typography, code, tables, forms, and buttons. Also includes Glyphicons, a great little icon set.

ComponentsBasic styles for common interface components like tabs and pills, navbar, alerts, page headers, and more.

JavaScript pluginsSimilar to Components, these JavaScript plugins are interactive components for things like tooltips, popovers, modals, and more.

BOOTSTRAPکامپوننت های

Button groups Button dropdowns Navigational tabs, pills, and lists Navbar Labels Badges Page headers and hero unit Thumbnails

Alerts Progress bars Modals Dropdowns Tooltips Popovers Accordion Carousel Typeahead

پیکربندی

مثال پیکربندی

BOOTSTRAPامکانات

Buttons:

Tabs:

Breadcrumb:

Pagination:

Alerts:

Progress bar:

JavaScriptامکانات

شخصی سازی

CSS- JavaScript-

LESS وBOOTSTRAP

CSS variables )Less(www.lesscss.org

استفاده کنیم؟Bootstrapچرا از

راحت•سریع•پشتیبانی در تمامی اندازه صفحات•پشتیبانی موبایل•کامل و بی نقص •

نمونه زنده

در اینجا نمونه کد و مثال را به صورت زنده مینویسیم و نمایش می دهیم

سوال؟

ممنون از توجه شما