Get the App
SLTechnology News&Howtos  ›  Development  › 

What are the differences between bootstrap3 and bootstrap4

Shulou Source: shulou.com Published: 2022-06-01 17:55:01 10月04日 Update

This article mainly introduces the differences between bootstrap3 and bootstrap4 related knowledge, the content is detailed and easy to understand, the operation is simple and fast, with a certain reference value, I believe you will gain after reading this bootstrap3 and bootstrap4 article, let's take a look at it.

Differences: 1, bootstrap3 has four grid classes, bootstrap4 has five grid classes; 2, bootstrap3 uses px as the unit, bootstrap4 uses rem and em as the unit; 3, bootstrap3 uses float layout, bootstrap4 uses flex layout.

Operating environment of this tutorial: Windows10 system, bootstrap3.3.7 version, DELL G3 computer

What's the difference between bootstrap3 and 4?

Float layout adopted by Bootsrap3 and flex layout adopted by Bootstrap

The grid system in Bootstrap4 does not need to add a specified number of columns. For example, if there are 2 col in the row, the row will be evenly distributed at any size.

There are only four grid classes in Bootstrap3 (col-xs very small, col-sm small, col-md, medium col-lg large)

There are 5 kinds of grid classes in Bootstrap4 (col- is very small, col-sm- is small, col-md- is large, col-lg- is large, col-xl- is super large)

Bootstrap4 uses rem as a unit

Bootstrap4 sets column offset through offset-sm-4, while Bootstrap3 sets column offset through col-sm-offset-4

Bootstrap4 adds responsive containers such as container-sm, container-md... . when it is smaller than the screen size, it will occupy the whole screen when it is smaller than the grid class

This is the end of the article on "what are the differences between bootstrap3 and bootstrap4". Thank you for reading! I believe you all have a certain understanding of the knowledge of "what is the difference between bootstrap3 and bootstrap4". If you want to learn more, you are welcome to follow the industry information channel.

Tags: Grid layout unit knowledge content size screen article system no value only container easy to operate tutorial article easy to understand more environment computer Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Shulou Information OPPO Reno Huawei Linux Shulou Tech Info