Bootstrap 5 tutorial In Hindi #2 | What Is New In Bootstrap 5

Hello Dear Readers, Today In this Post, You will learn Bootstrap 5 Tutorial For Beginners #2 – Introduction In Hindi. Earlier I have shared Bootstrap 5 Tutorial For Beginners #1 – Introduction In Hindi. and now it’s time to Bootstrap 5 Tutorial For Beginners #2 – Introduction In Hindi.

 

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

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.

Play Video

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 vertical max-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.

Leave a Reply

Your email address will not be published. Required fields are marked *

Introducing Official ApeStaking Protocol for ApeCoin.

New Blur NFT Marketplace Courting Professional.