Utility classes for common layout patterns, borders, visibility, and more
Visibilidad
| Clase | Descripción |
|---|---|
.pc-hide
| Always hidden |
.pc-show
| Always visible |
.pc-hide-{bp}
| Hidden at breakpoint and up |
.pc-show-{bp}
| Visible at breakpoint and up |
.pc-hide-below-{bp}
| Hidden below breakpoint |
.pc-show-below-{bp}
| Visible below breakpoint |
Breakpoints:
sm (576px), md (768px), lg (992px), xl (1200px)
Utilidades de borde
Añadir/quitar borde
border- All sidesborder-top/border-bottomborder-start/border-endborder-0- Remove all borders
Radio de borde
rounded- Default radiusrounded-0- No radiusrounded-sm- Small radiusrounded-lg- Large radiusrounded-circle- Circle (50%)rounded-pill- Pill shape
Desbordamiento
| Clase | Descripción |
|---|---|
.overflow-auto
| Scroll when needed |
.overflow-hidden
| Clip overflow |
.overflow-visible
| Show overflow |
.overflow-scroll
| Always show scrollbar |
.overflow-x-auto
| Horizontal scroll when needed |
.overflow-y-auto
| Vertical scroll when needed |
Posición
position-static/position-relative/position-absolute/position-fixed/position-stickytop-0,bottom-0,start-0,end-0- Position edgestranslate-middle- Center with transform
Cursor
| Clase | Descripción |
|---|---|
.cursor-pointer
| Pointer (clickable) |
.cursor-default
| Default arrow |
.cursor-not-allowed
| Not allowed |
.cursor-grab
| Grab (draggable) |
.cursor-help
| Help (question mark) |
.cursor-text
| Text selection |
.cursor-move
| Move/drag |
Interacción
pe-none- Disable pointer eventspe-auto- Enable pointer eventsuser-select-none- Prevent text selectionuser-select-all- Select all on click