The grid system is the core of Bootstrap. It is precisely because of the existence of the grid system that Bootstrap can have such a powerful responsive layout solution.
The following is an explanation from the official documentation:
Bootstrap provides a responsive, mobile-first fluid grid system that changes with the screen or viewport. As the size increases, the system will automatically divide it into up to 12 columns. Contains predefined classes for simple layout options, as well as powerful mixin classes for generating more semantic layouts.
Let’s understand this paragraph and find that the most important part is mobile device priority. So what is mobile device priority?
Bootstrap's basic CSS code starts by default on small screen devices (such as mobile devices, tablets), and then uses media queries to expand to components and grids on large screen devices (such as laptops, desktop computers).
has the following strategy:
Content: Decide what is most important.
Layout: Prioritize designing smaller widths.
Progressive enhancement: Add elements as the screen size increases.
The above is the detailed content of what is bootstrap grid system. For more information, please follow other related articles on the PHP Chinese website!