什么是Bootstrap?
它是2011年末以来的开源框架，用于更快，更轻松地使用移动优先方法设计响应式网站。 Bootstrap可用于HTML，CSS和JS。根据PHP，Node等服务器端语言，引导程序有助于设计前端。
为什么要Bootstrap?
- 更快更容易
- 移动优先风格
- 这是免费的 ！可在www.getbootstrap.com中获得
- 提供更多支持
- 响应式设计
Bootstrap 5 alpha于2020年6月中旬发布。由于它是alpha-1版本，因此将来可以在bootstrap 5中添加更多功能
在bootstrap 5的alpha-1版本中，删除的一些类是：
- 表格–行
- 表格–内联
- 清单–内联
- 卡–甲板
一些添加的类：
- gx-* (类控制水平/列装订线的宽度)
- gy-* (类控制垂直/行装订线宽度)
- g-* (类控制水平和垂直装订线宽度)
- 行cols自动
Bootstrap 4和Bootstrap 5之间的区别
| BASIS OF | BOOTSTRAP 4 | BOOTSTRAP 5 | ||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Grid System | It has 5 tier (xs, sm, md, lg, xl). | It has 6 tier (xs, sm, md, lg, xl, xxl). | ||||||||||||||||||||||||||||||
| Color | It has limited colors. | Extra colors added with improved color palette. | ||||||||||||||||||||||||||||||
Jquery
| It has jquery and all related plugins. |
Jquery is removed and switched to vanilla JS with some working plugins |
Internet Explorer |
Bootstrap 4 supports both IE 10 and 11. |
Bootstrap 5 doesn’t support IE 10 and 11. |
Form elements |
Radio buttons, checkboxes have different look in different OS and browsers. |
Whether it may be any OS or browsers, the look of form elements will not change. |
Utilities API |
We cannot modify utilities in bootstrap 4 |
Bootstrap 5 gave freedom to modify and also create our own utility |
Gutter |
We use .glutter with fontsize in px |
We use .g* with fontsize in rem |
Vertical Classes |
Columns can be positioned relative |
Columns cannot be positioned relative |
Bootstrap Icons |
Bootstrap 4 doesn’t have its own SVG icons we have to font-awesome |
Bootstrap 5 have its own SVG icons |
Jumbotron |
It supports. |
It doesn’t support jumbotron. |
Card deck |
Card deck is used to create set of cards with equal width and height. |
Card deck class in removed in bootstrap |
Navbar |
We have inline-block property and we will get white dropdown as default for dropdown-menu-dark class. |
inline-block property is removed and we will get black dropdown as default for dropdown-menu-dark class. |
Static Site Generator |
Bootstrap 4 uses Jekyll software. |
Bootstrap 5 uses Hugo software. |
|