What are the Default Column Classes in Bootstrap 5 ?
Bootstrap 5 offers default column classes for creating responsive grid layouts. These classes, ranging from col- for extra small devices to col-xl- for extra-large desktops, ensure that content adapts seamlessly across various screen sizes.
Syntax:
<!-- Extra small devices (phones) -->
<div class="col-">
<!-- Small devices (tablets) -->
<div class="col-sm-">
<!-- Medium devices (desktops) -->
<div class="col-md-">
<!-- Large devices (large desktops) -->
<div class="col-lg-">
<!-- Extra large devices (extra-large desktops) -->
<div class="col-xl-">
Key Features:
- Responsive Design: The default column classes cater to various device sizes, ensuring a responsive layout.
- Viewport Breakpoints:
col-
represents the extra small (xs) devices, whilecol-sm-
,col-md-
,col-lg-
, andcol-xl-
correspond to small, medium, large, and extra-large devices, respectively.
Contact Us