+
Cards In This Set
| Front | Back |
|
What is Bootstrap?
|
Bootstrap could be called many things, but the most apt is probably an "HTML, CSS and JavaScript Framework". It prescribes a set of best practices for organizing your markup into a grid-based layout and gives you a full library of helpful widgets and features to implement within that grid.
|
|
Why is Bootstrap called "Twitter Bootstrap"?
|
The engineers at Twitter created it as an internal tool and then decided to open-source it for everyone else to use. In this case, the engineers were re-using widgets and styles so much that they codified them into a formal framework.
|
|
What files are included in the download?
|
Bootstrap is essentially just a big CSS file, a big JavaScript file, and then some font files to support them.
|
|
How do you include Bootstrap in your projects?
|
You can either download or import Bootstrap into your projects. To download: You can download the source code from their website. Choose the leftmost option ("Bootsrap" and NOT "Source code" or "Sass"). It will give you a zip archive with the necessary files. Just include those CSS and JS files in your project as you normally would. To import: If you don't feel like downloading Bootstrap, they've generously offered to serve it to you directly from their CDN servers for free. Just include the following two links in your <head> tag and, PRESTO! You've got Bootstrap. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
|
|
What other JavaScript library is required to use Bootstrap and how do you get it?
|
JQuery Put this in the head before bootstrap.<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
|
|
Where can you go to find information about the CSS styles and components that are available to you?
|
Https://getbootstrap.com
|
|
How does the Bootstrap grid system work?
|
Null
|
|
What happens to margin/padding and overall width when you enclose everything in a container?
|
15px padding is added to left and right by the container.
|
|
What happens to margin/padding when you create a new row?
|
15px padding is subtracted from left and right putting overall padding back at 0.
|
|
What happens to margin/padding when you create a new col (e.g. col-md-8)?
|
15px padding is added to the left and right again.
|
|
What two classes should always wrap a col-md-8?
|
Container and row
|
|
What behavior occurs as the screen is resized from very wide to mobile-sized on a <div class="col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-6 col-lg-offset-3">?
|
Null
|
