css and bootstrap
DESCRIPTION
CSS AND BOOTSTRAP. Sajad alishahnejad – ali akbari boroumand Internet engineering – Khaje nasir university of technology - 2014. CSS و فریمورک ها. در CSS قدرت زیادی نهفته است. در بسیاری از سایت ها قسمت هایی مشابه وجود دارد که نیازی نیست دوباره نوشته شود. - PowerPoint PPT PresentationTRANSCRIPT
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چرا از
راحت•سریع•پشتیبانی در تمامی اندازه صفحات•پشتیبانی موبایل•کامل و بی نقص •
نمونه زنده
در اینجا نمونه کد و مثال را به صورت زنده مینویسیم و نمایش می دهیم
سوال؟
ممنون از توجه شما