For today's lab, we'd like you to code up the mockups using Twitter Bootstrap.
- For each mockup, create a new HTML page and include Twitter Bootstrap in your head tag
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
- Since you are not running your code on a server, make sure that you include http:// in all of your bootstrap links
- Be sure to check your networks tab to ensure that Bootstrap is included and working
- Now you're ready to start coding!
- Try to use as little external CSS as possible, you should be able to do almost everything using Bootstrap classes. Challenge yourself to write as little CSS as possible.
- Use http://lorempixel.com or http://placekitten.com/ if you need a placeholder for images
- When you are finished or even if you do not get done in time, make sure to push your code to github
Check out the Bootstrap Examples to see sample layouts and inspect the layout.
- Complete Mock 3
- Implement a Twitter Bootstrap carousel in Mock 3
- Include a dropdown or modal into one of your mockups