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.
Thanks,
Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests. Click Agree and Proceed to accept cookies and go directly to the site or click on View Cookie Settings to see detailed descriptions of the types of cookies and choose whether to accept certain cookies while on the site.
About Author
Saloni Arora
Saloni Arora is a very positive person she always likes to take things positively. she has a desire of being a talented Front end developer . and she is seeking to grab more opportunities in future