tsyan / wdi_3_css_demo_bootstrap Goto Github PK

Is a responsive design framework. Somewhere between a canned CMS and a site built from raw CSS.

http://emmet.io

Bootstrap Examples

BuiltwithBootstrap

LoveBootstrap

ExpoBootstrap Sites noticed by developers of bootstrap.

Build a Contact Page Simple

• Work through steps.txt
• Work through steps2.txt

Then if you can

Build a More Complete Contact Page

• LESS

• Zurb Foundation
  • Built with SASS

• Some of the work is already done for you.

• Customizable

  Doesn't NEED to look like all the other sites that use bootstrap.

• Mobile first approach. Think about design on small devices, phones.

• No more sprite icons. Could not scale up or change color of sprites. Because they are built with raster images.

  Replaced by vector icons that can scale up fonts. Because they are with vector images.

• Good Browser Support Need some hack to get I.E 8 to work otherwise works on I.E 9 and above.

• Code "bloat"

  More code that if this was developed for one app using custom CSS/HTML/JS.

• Built with LESS

  Rails uses SASS/SCSS by default. But, there is a gem that works around this problem.

###Avoid customization in the download.

Will have to remember all the choices in this version if you have get a more recent version.

Series of icons you can use. All vector based, as opposed to raster based.

Bootstrap javascript depends on JQuery. Add jquery to the bottom of the body, the footer. This will make sure that the HTML is loaded before the javascript.

• template.html
• Bootstrap CDN

• 12 column grid
• 4 sizes, extra small
• extra small (col-xs) < 768 pixels
• small (col-sm) >= 768 pixels
• medium (col-md) >= 992 pixels
• large (col-lg) >= 1200px