In this tutorial, You will learn full Bootstrap 5. This is Part-2 of Bootstrap 5 tutorial I will give all the part here and if you want to go deep in the tutorial so you can watch the full video which is I like below Hope it will help you all thank for visiting.
Whats New In Bootstrap 5
New logo!
One of the biggest changes with v5 came with our redesigned logo and updated docs design. Inspired by the work we’ve done in Bootstrap Icons, our new logo is a callback to CSS’s curly braces and our longstanding B
icon. It’s a small upgrade, but a fun one nonetheless, and one that we feel helps set the tone for this new major release. Still the same Bootstrap, just slightly refined. 😅
New offcanvas component
Built on and sharing fundamental pieces of our modals, our new offcanvas component comes with a configurable backdrop, body scroll, and placement. Offcanvas components can be placed on the top, right, bottom, or left of the viewport. Configure these options with data
attributes or via the JavaScript APIs.
New accordion
We’ve replaced our .card
accordion component with a brand new .accordion
component, solving several bugs in the process. Our new accordion still uses the Collapse JavaScript plugin, but with custom HTML and CSS to support it, it’s better and easier than ever to use.
New and updated forms
We’ve overhauled our Forms documentation and components. We’ve consolidated all our forms styles into a new Forms section (including the input group component) to give them the emphasis they deserve.
Logical properties for spacing utilities
Part of our approach to adding RTL to Bootstrap was to add it in a way that felt future-friendly to ourselves and the web at large. As such, we’ve embraced the spirit of CSS logical properties and have renamed several classes and variables. It’s a risky change because of the size and impact of the change, but we hope you’ll appreciate it overall!
More component updates
Across the board we’ve made a number of other enhancements and changes to key components:
- We’ve overhauled the JavaScript and positioning for our dropdowns as part of our adoption of Popper 2. You can see all the options in a new example in our docs and new CSS selectors and data attributes used to position them.
- Dropdown menus now have a new
.dropdown-menu-dark
modifier class. - Similarly, carousels now have a new
.carousel-dark
modifier class to invert the controls, text, and indicators. - Added icon examples to our Alert component for adding Bootstrap Icons (or other icon libraries) using utilities
- Our close button has been redesigned with an SVG
background-image
and improved cross-browser styling. - We’ve dropped the
.btn-block
class for utilities. - We’ve updated navbars with a new
.navbar-nav-scroll
for verticalmax-height
and scrolling of when a collapsed navbar is opened - List groups have a new
.list-group-numbered
modifier class that uses pseudo-elements to create numbered list group items.
Thanks for visiting post hope you will find it helful.