API de CSS
Layout
|
Selector
|
Descripción
|
Estado
|
Fichero
|
|
h1 ... h6
|
Añaden significado semantico pero no estilos salvo que son tipo bloque.
|
|
|
|
.clearfix
|
Limpieza de floats
|
Activo
|
layout.css
|
|
.layout-row-1 ... .layout-row-6
|
Dividir el elemento en cuestión en columnas
|
Activo
|
layout.css
|
|
.layout-wrapper
|
|
|
layout.css
|
|
.expand
|
Estirar un elemento hasta ocupar el espacio vacio que lo rodea
|
Alpha
|
layout.css
|
|
.bp-block-content
|
|
Alpha
|
render.css
|
|
.bp-block-image
|
|
Alpha
|
render.css
|
|
.bp-video-container
|
|
Alpha
|
render.css
|
Responsive
| Selector | Descripción | Estado | Fichero |
| large | Pantalla grande / Escritorio | Activo | render.css |
| medium | Pantalla mediana / Tablet | Activo | render.css |
| small | Pantalla pequeña / Móvil horizontal | Activo | render.css |
| tiny | Pantalla muy pequeña / Móvil vertical | Activo | render.css |
| Selector | Descripción | Estado | Fichero |
| .b-container | responsive image (max-width: 100%) | Activo | render.css |
| .b-col | stretched responsive image (width: 100%) | Activo | render.css |
| .b-row | intrinsic ratio wrapper; default 16:9 ratio | Activo | render.css |
| .b-hidden-large | Oculto para pantallas grandes | Activo | render.css |
| .b-hidden-medium | Oculto para pantallas medianas | Activo | render.css |
| .b-hidden-small | Oculto para pantallas pequeñas | Activo | render.css |
| .b-hidden-tiny | Oculto para pantallas muy pequeñas | Activo | render.css |
| .b-col-large[1-12] | Columnas ancho de 1 a 12 para pantalla grande | Activo | render.css |
| .b-col-medium[1-12] | Columnas ancho de 1 a 12 para pantalla mediana | Activo | render.css |
| .b-col-small[1-12] | Columnas ancho de 1 a 12 para pantalla pequeña | Activo | render.css |
| .b-col-tiny[1-12] | Columnas ancho de 1 a 12 para pantalla muy pequeña | Activo | render.css |
Media
|
Selector
|
Descripción
|
Estado
|
Fichero
|
|
.rwd-img
|
responsive image (max-width: 100%)
|
Activo
|
render.css
|
|
.rwd-img-st
|
stretched responsive image (width: 100%)
|
Activo
|
render.css
|
|
.intrinsic
|
intrinsic ratio wrapper; default 16:9 ratio
|
Activo
|
render.css
|
|
.ir
|
image replacement (@mixin included)
|
Activo
|
render.css
|
|
.ratio-16-9
|
Mantener ratio del elemento |
Activo
|
render.css
|
| ..ratio-16-10 |
Mantener ratio del elemento
|
Activo
|
render.css
|
|
.ratio-square
|
Mantener ratio del elemento
|
Activo
|
render.css
|
|
.ratio-inner
|
Mantener ratio del elemento
|
Activo
|
render.css
|
Texto
|
Selector
|
Descripción
|
Estado
|
Fichero
|
|
.c-i
|
inherit ancestor text color
|
Activo
|
render.css
|
|
.kern
|
enable font kerning
|
Activo
|
render.css
|
|
.whs-nw
|
prevent wrapping on whitespace
|
Activo
|
render.css
|
|
.truncate
|
limit text to a single line, truncating with an ellipsis
|
Activo
|
render.css
|
|
.wfsm
|
font anti-aliasing
|
Activo
|
render.css
|
|
.text-hide
|
Texto para buscadores. Oculta el texto. Por ejemplo para que se vea la imagen de fondo en un h1
|
Activo
|
render.css
|
|
.sr-only
|
Texto solo disponible para lectores de pantalla
|
Activo
|
render.css
|
Impresión
|
Selector
|
Descripción
|
Estado
|
Fichero
|
|
.visible-print-block
|
Hidden
|
Visible (as block)
|
|
|
.visible-print-inline
|
Hidden
|
Visible (as inline)
|
|
|
.visible-print-inline-block
|
Hidden
|
Visible (as inline-block)
|
|
|
.hidden-print
|
Visible
|
Hidden
|
Alineación vertical
|
Selector
|
Descripción
|
Estado
|
Fichero
|
|
.va-t
|
align to top
|
Activo
|
render.css
|
|
.va-m
|
align to middle
|
Activo
|
render.css
|
|
.va-b
|
align to bottom
|
Activo
|
render.css
|
Alineación horizontal
| Selector | Descripción | Estado | Fichero |
| .ba-c | Alinear centro | Activo | render.css |
| .ba-l | Alinear izquierda | Activo | render.css |
| .ba-r | Alinear derecha | Activo | render.css |