Quick Comparison Between Bootstrap 3 And Bootstrap 4 Onwards
Posted By Saloni Arora | 24-May-2018
BBootstrap is a most common and widely used framework to design websites and web pages. Now bootstrap has launched bootstrap 4 which provide more responsiveness and faster stylesheets. It also made It easy to develop
Bootstrap 4 is not supported on IE9.
Quick Comparison between Bootstrap 3 and Bootstrap 4.
Global Changes made in the latest version.
1)LESS CSS has been switched with SCSS.
2)Font size have been increased from 14px to 16px.
Image Changes made in the latest version.
1).img-responsive has been changes to .img-fluid.
2).img-circle has been changes to .rounded-circle
3).img-rounded has been changes to .rounded
Improved grid system.
Bootstrap 4 has now changed the 4 tier grid system to 5 tier grid system.
1) Example-.col-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xl-4 .
It has removed the xs cateogory and in this col- can do the work.
Navigation bar Changes made in the latest version.
1) .navbar-default is now changed to .navbar-light. : In Bootstrap 3 default navbar was class was .navbar-default. and in Bootstrap 4 it is navbar light.
2).navbar-toggle is now changed to .navbar-toggler. . : Navbar toggle is replaced with Navbar toggler class it is no different with it.
Some More Changes.
- Glyphicons are not supported in bootstrap 4.
- Dropdowns can be created using <ul> or <div>. firstly, Dropdowns were made with the help of the <ul> and <li> tag. But now it has provided the ease of developing to the user.
New feature in Bootstrap 4 is:
New Utility Classes for Spacing:
a) Bootstrap 3 uses the clearfix just to adjust the floating <div>.
b) This simply means that it uses .m-a-0 to Set all the margins set to zero. Margins are styled by m prefix and padding are styled and use the prefix p.
I hope it will help you understand it quickly.