02 Handout 1 Flashcards
is a known web development framework that helps to build web user interfaces
Bootstrap
This framework itself consists of a combination of JavaScript and CSS
Bootstrap
It contains a lot of components required to develop a full-functioning web user interface.
Bootstrap
It is one of the most important and widely used features. It has the ability to organize the page and the core of its functionality is the grid system
Layout
The grid system has different sizes of displays. It offers extra-small, small, medium, arge, and extra-large displays
Layout
Along with the grid system, it offers responsive containers, breakpoints for adjusting page layouts, media objects, and utility classes
Layout
Bootstrap has a huge college of basic user interface components that allow you to construct any type of user interface
Components
Bootstrap offers dialogs, progress bars, tooltips, navigation bars, carousel, alerts, popovers, drop-down menus, input groups, tabs, cards, pagination, forms, list groups, bread crumbs, and a jumbotron.
All of these components are ready to use.
Components
Bootstrap allows you to create responsive websites that can be viewed on mobile devices without too much development work.
Mobile Support
Bootstrap 4 is designed to work across all resolutions from mobile to tablet, and to desktop.
Mobile Support
Bootstrap offers a large selection of utility classes that encapsulate the most commonly needed functionality in order to reduce the number of repetitive style rules
Utilities
Examples include rules for aligning text, hiding an element, or providing contextual colors for warning test
Utilities
Bootstrap offers a collection of themes can be used or followed for designing websites
Themes
What are the common themes?
- Dashboard
- Marketing
- Generic Web Application
is the most commonly used feature in Bootstrap as it solves the important task for vertical and horizontal positioning of a page’s contents
Grid System
the available display size to render the contents of a page. It refers to your browser window, minus the toolbars, and scrollbars
View Port
the core of Bootstrap’s grid system
Containers
renders the contents of the page to a fixed width
Container Class
Five (5) core breakpoints of the grid system
- Extra small
- Small
- Medium
- Large
- Extra large
allows the page to be fully responsive to all widths, providing smoother transitions
Container-fluid
used to define a selection of elements that should be dealt with as a horizontal group
Row
the most important piece of the grid system.
Columns
Rows exists within containers, and those rows are split up into … equal columns.
12
a very simple cue that helps draw attention to certain content
Jumbotron
generally used as a splash to offer immediate information to the user
Jumbotron
provide an elegant way of displaying and grouping related content
Tabs
one of the Bootstraps components that require jQuery and bootstrap.js to function correctly
Tabs
acts as a slideshow, with a list of nested elements as the slides
Carousel
simply a case of creating the modal markup, using Bootstrap’s modal classes, and using HTML attributes, data-toggle, data-target, and data-dismiss, to surface and remove the modal
Modals
a powerful, responsive component to provide sensible navigation around a website
Navigation Bar (NavBar)
Bootstrap provides different basic designs that allow you to improve the look and feel of the common elements that are used to construct user interfaces.
Navigation Bar
Common elements that are used to style are buttons, input fields, paragraphs, special inline text, figures, tables, and navigation controls.
Navigation Bar
additional navigation for a website that may contain links, buttons, company info, copyrights, forms, and other elements
Footer
