Bootstrap 4 tutorial – Beta 2 version
I am learning Bootstrap 4 by following this coursera course: Front-End Web UI Frameworks and Tools: Bootstrap 4 I have learnt a lot through the way.
However, since this course is based on Bootstrap 4 alpha version and now Bootstrap 4 has already moved into Beta 2 version, I have found that a lot of things have already changed. It does take me some time to figure out how to adjust the code for the newer version by looking at the css file and documents.
I have browsed around and I didn’t see any good tutorial for the latest Bootstrap 4 version. So I guess it might be a good idea to write one.
I will still be following the structure and sequence of the coursera course coupled with the code working for the latest Bootstrap version and my understanding from a learner’s perspective.
Ready to learn Bootstrap 4 now? Let’s go!
Bootstrap Grid System
Introduction to Bootstrap Grid System
Write a simple page with Bootstrap Grid System
Re-order our content
Use offset to leave some space
Hide stuffs with a responsive design
Build up a Navigation Bar
What is navigation bar and why is it important
Build up a navigation bar
Different front color and fixed top
Collapse into a button
Build breadcrumbs with Bootstrap