Wednesday, 28 June 2017

BOOTSTRAP 3 BASICS



by Karishma,






Bootstrap is a front-end framework that builds responsive websites. With a mobile-first approach at its core, its grid system allows designers to create sites for small screens, then scale designs up from there.

It uses a combination of HTML5 mark-up, compiled and minified CSS styling, fonts, and JavaScript. Bootstrap CSS is customizable, and even supports Less and Sass pre-compiled CSS, in addition to plain CSS files.

Other highlights:

1. What you can do with Bootstrap: create transition effects, image galleries, image carousels, alert messages, tool tips, dashboards, sticky footers, buttons, progress bars, popovers, pagination, drop-down menus, cover pages, and the Scroll Spy plug-in, which automatically updates a nav bar for the user, depending on where they are on the page.

2. A variety of templates: Bootstrap design templates include features like typography, forms, buttons, tables, different navigation styles, modals, and more.

3. Convenient layout classes: These consist of Large (desktops), Medium (smaller desktops or laptops), Small (tablets), and Extra Small (mobile phones), which include containers, rows, and up to 12 columns that can be combined to make larger columns. Bootstrap allows you to start out with stacked layouts (for mobile devices) that migrate to horizontal, for desktop versions. 

4. The convenience of Grunt: Grunt is a JavaScript task runner that’s all about automation. It manages repetitive tasks like compiling, “magnification,” and unit testing, so your team doesn’t have to. 

5. Browser compatibility: It’s compatible with Chrome, Firefox, Internet Explorer 8 and up, Safari, and Opera. Note: Bootstrap will degrade some of its features by default to work finely on older browsers. 

6. The Bootstrap Markup API: Bootstrap’s all-around best API that lets you use every JavaScript plugin without writing a single line of JS code. 

7. Open source: Bootstrap is open-source. Download Bootstrap from GitHub and link it right into a site’s HTML file. 

8. CSS pre-processors: Bootstrap lets you implement both the Sass and Less CSS pre-compilers. 

9. Easy JavaScript extensions: JavaScript plugins can be downloaded in just one file. To use Bootstrap with JavaScript add-ons, just reference the jQuery library in the HTML. It’s also consist custom jQuery plugins that can be used individually, or compiled and minified. 

10.Compatible with Bower: Bootstrap can be installed with Bower, a powerful package manager that helps you manage all the parts of your website like libraries, frameworks, utilities, and more.