Bootstrap 4 Get Started, Introduction, What is Bootstrap?
What is Bootstrap?
Bootstrap is a free front-end framework for faster and easier web development.
Bootstrap is used to create responsive designs very easily.
History of Bootstrap:
Bootstrap was developed on Twitter by Mark Otto and Jacob Thornton and released in 2011 on GitHub as an open-source product.
In June 2014, Bootstrap was considered the No. 1 project on GitHub!
Why use bootstrap?
Advantages of Bootstrap:
Easy to use: Anyone who knows HTML and CSS can start using Bootstrap.
Responsive Feature: Bootstrap's Responsive CSS easily adjusts to phones, tablets, and desktops.
Mobile-First Priority: In Bootstrap (3), a part of the Mobile-First Style Core Framework.
Browser Support: Bootstrap supports almost all modern browsers (chrome, firefox, internet explorer, safari, and opera).
Where to find bootstrap?
There are two ways to use Bootstrap on your web site.
Download from getbootstrap.com
Adds bootstrap from CDN
If you want to download and host your own bootstrap, go to getbootstrap.com, and follow the steps.
If you do not want to manually download and host, you can add it from CDN (CDN = Content Delivery Network).
Create the first web page with bootstrap
1. Add HTML (5) DOCTYPE.
HTML elements and CSS properties are used in Bootstrap, for which it is mandatory to set HTML (5) DOCTYPE.
Always add HTML (5) DOCTYPE at the beginning of the page
2. Bootstrap (3) Mobile-First
Bootstrap (3) has been made more responsive to mobile devices. Mobile-first style, a part of the core framework.
Confirm the <meta> tag in the <head> element for proper output and touch zooming:
Width=device-width is used to set the page width based on the screen-width of the device (depending on the device).
Initial-scale=1 is used to set the initial zoom of the page when it is first loaded by the browser.
The element in the bootstrap needs to be placed in a container.
There are two types of containers in Bootstrap. Save the container according to your needs:
Use the .container class to create responsive fixed-width containers.
Use the .container-fluid class to measure the full width of the viewport to a full-width container.
Note: Containers are not nestable (you cannot place containers in containers if you wish).
Two basic bootstrap pages
The following example shows the basic page of Bootstrap with code:
bootstrap download, bootstrap install, bootstrap 4 installs, bootstrap 4 downloads, bootstrap setup, bootstrap 4 setups, bootstrap 4 CDN