{"id":439,"date":"2020-08-13T22:55:09","date_gmt":"2020-08-13T22:55:09","guid":{"rendered":"https:\/\/servicesground.com\/whats-new-in-bootstrap-5\/"},"modified":"2021-02-25T19:12:44","modified_gmt":"2021-02-25T19:12:44","slug":"whats-new-in-bootstrap-5","status":"publish","type":"post","link":"https:\/\/servicesground.com\/blog\/whats-new-in-bootstrap-5\/","title":{"rendered":"What You Got New In Bootstrap 5?"},"content":{"rendered":"
. Switch to the JavaScript Vanilla<\/span><\/p>\r\n . Enhanced Grid System<\/span><\/p>\r\n . Enhanced Documentation<\/span><\/p>\r\n . New APIs Available<\/span><\/p>\r\n . JQuery has been removed<\/span><\/p>\r\n . Enhanced Modularity<\/span><\/p>\r\n . Improved Form<\/span><\/p>\r\n . New Font Responsive<\/span><\/p>\r\n . New Utilities and Helpers<\/span><\/p>\r\n . Easier Customization Theming<\/span><\/p>\r\n . Lighter Package<\/span><\/p>\r\n . Support for Drop Internet Explorer 10 and 11<\/span><\/p>\r\n <\/p>\r\n \u00a0<\/p>\r\n Mark Otto, the founder of Bootstrap has written:<\/span><\/p>\r\n Bootstrap is no longer reliant on jQuery “We’re sharpening our emphasis on creating more future-friendly resources and while we’re still not completely there,<\/span><\/p>\r\n The promise of CSS variables, faster JavaScript, fewer dependencies, and better APIs definitely felt right to us. jQuery brought millions (billions?) of people unparalleled access to complex JavaScript behaviors over the past decade and a half. Personally, I’m forever grateful for the inspiration and help it offered me to continue writing front-end code, learning new technologies, and accepting plug-ins. Thanks to every developer and maintainer of jQuery who made this possible for people like me.<\/span><\/p>\r\n Due to advancements in front-end development software and browser support, we can now remove jQuery as a dependency, but you will never find anything else.<\/span><\/p>\r\n We’re focused more on developing tools that are more future-oriented, and although we’re not yet completely there, the promise of CSS variables, JavaScript faster,<\/span><\/p>\r\n No doubt fewer dependencies and stronger APIs sound good for us.”<\/span><\/p>\r\n <\/p>\r\n BOotstrap5 hunkered in many places and strengthened our documentation, providing more clarity, eliminating uncertainty,<\/span><\/p>\r\n And giving even more support for Bootstrap extension. It all begins with a whole new segment on Customizing.<\/span><\/p>\r\n Team bootstrap built on the improvements to our Docs homepage in v4.5.0 with an updated look and feel for the rest of our documents. Our document pages are no longer full-width to improve readability and make our website feel less. We’ve also Modified our sidebar to use expandable parts (powered by our own Collapse plugin) to navigate more quickly.<\/p>\r\n <\/p>\r\n With the end of Internet Explorer support, custom CSS properties are now available. Up to version 4, there are only a few variables related to colors and fonts.<\/span><\/p>\r\n Even then, some elements and layout options are available & can be specified by variables in version 5.<\/span><\/p>\r\n For example, in version 5, you can use CSS custom properties to set table elements<\/span><\/p>\r\n Code:<\/span><\/p>\r\n [code].table {<\/span><\/p>\r\n –bs-table-bg: #{$table-bg};<\/span><\/p>\r\n –bs-table-accent-bg: transparent;<\/span><\/p>\r\n –bs-table-striped-color: #{$table-striped-color};<\/span><\/p>\r\n –bs-table-striped-bg: #{$table-striped-bg};<\/span><\/p>\r\n –bs-table-active-color: #{$table-active-color};<\/span><\/p>\r\n –bs-table-active-bg: #{$table-active-bg};<\/span><\/p>\r\n –bs-table-hover-color: #{$table-hover-color};<\/span><\/p>\r\n –bs-table-hover-bg: #{$table-hover-bg};<\/span><\/p>\r\n \/\/ Styles here…<\/span><\/span><\/p>\r\n }[\/code]<\/p>\r\n <\/p>\r\n\r\n If you liked this article please subscribe to our newsletter and YouTube channel<\/a> for video tutorials and free online courses.<\/p>\r\n\r\n\r\n\r\nWhy was jQuery removed from Bootstrap 5?<\/span><\/h2>\r\n
<\/span>\u25c6 Improved customizing docs<\/span><\/h2>\r\n
\u25c6 New look and feel<\/span><\/h2>\r\n
\u25c6 CSS custom properties<\/h2>\r\n