bootstrap5 beta 已经发布，本文介绍bootstrap4升级到bootstrap5方法
Components
- 替换
.dropleft和.dropright为.dropstart和.dropend。 - 替换
.dropdown-menu-*-left和.dropdown-menu-*-right为.dropdown-menu-*-start和.dropdown-menu-*-end。 - 替换
.bs-popover-left和.bs-popover-right为.bs-popover-start和.bs-popover-end。 - 替换
.bs-tooltip-left和.bs-tooltip-right为.bs-tooltip-start和.bs-tooltip-end。 - 替换
.carousel-item-left和.carousel-item-right为.carousel-item-start和.carousel-item-end。
Utilities
- 替换
.left-*和.right-*为.start-*和.end-*。 - 替换
.float-left和.float-right为.float-start和.float-end。 - 替换
.border-left和.border-right为.border-start和.border-end。 - 替换
.rounded-left和.rounded-right为.rounded-start和.rounded-end。 - 替换
.ml-*和.mr-*为.ms-*和.me-*。 - 替换
.pl-*和.pr-*为.ps-*和.pe-*。 - 替换
.text-left和.text-right为.text-start和.text-end。
Mixins
- 替换
border-left-radius()和border-right-radius()为border-start-radius()和border-end-radius() — as well as their corner relative variants (eg. .border-bottom-left-radius became .border-bottom-start-radius)。 - 替换
caret-left()和caret-right()为caret-start()和caret-end() — subsequently, the caret() mixin now takes start和end as arguments instead of left和right。
Variables
- 替换
$navbar-brand-margin-right为$navbar-brand-margin-end。 - 替换
$pagination-margin-left为$pagination-margin-start。 - 替换
$form-check-padding-left为$form-check-padding-start。 - 替换
$form-switch-padding-left为$form-switch-padding-start。 - 替换
$form-check-inline-margin-right为$form-check-inline-margin-end。 - 替换
$form-select-feedback-icon-padding-right为$form-select-feedback-icon-padding-end。
JavaScript
见官网