Especifica la alineación predeterminada de los

elementos dentro del contenedor flexible

align-content
cuando dichos elementos ocupan más de una
línea.

Especifica la alineación predeterminada de los

elementos dentro del contenedor flexible
align-items
cuando dichos elementos ocupan una sola
línea.

Especifica la alineación de los elementos

align-self
seleccionados dentro del contenedor flexible.

Establece el valor de todas las propiedades del

all
elemento seleccionado.

Especifica las animaciones basadas

animation
en keyframes.

Define el número de segundos (s) o

animation-delay milisegundos (ms) a esperar antes de que
comience la animación

Define si una animación debe reproducirse

animation-direction
hacia adelante, hacia atrás o en ciclos alternos

Especifica cuánto tiempo debe tomar una

animation-duration
animación para completar un ciclo.
 Especifica un estilo para el elemento cuando la
animation-fill-mode
animación no se está reproduciendo.

Indica el número de veces que se debe

animation-iteration-count
reproducir una animación.

Especifica un nombre para la animación

animation-name
@keyframes.

Esta propiedad indica si la animación está en

animation-play-state
ejecución o en pausa.

Especifica el TIEMPO que usa una animación

animation-timing-function para cambiar de un conjunto de estilos CSS a
otro.

Define si la cara posterior de un elemento

debe ser visible o no cuando mira al usuario.
backface-visibility Esta propiedad es útil cuando se gira un
elemento. Te permite elegir si el usuario debe
ver la cara posterior o no.

Es una propiedad abreviada para: background-

color, background-image, background-
background position, background-size, background-repeat,
background-origin, background-clip,
background-attachment.

Establece si una imagen de fondo se desplaza

background-attachment
con el resto de la página o si es fija.

Define el modo de fusión de cada capa de

background-blend-mode
fondo (color y/o imagen).

Indica hasta dónde debe extenderse el fondo

background-clip
(color o imagen) dentro de un elemento.

background-color Establece el color de fondo de un elemento.

Establece una o más imágenes de fondo para

background-image
un elemento.
 Especifica la posición de origen (el área de
background-origin posicionamiento de fondo) de una imagen de
fondo.

Establece la posición inicial de una imagen de

background-position fondo. El primer valor es la posición horizontal
y el segundo la posición vertical.

Estable cómo o sí se repetirá una imagen de

background-repeat
fondo.

background-size Establece el tamaño de las imágenes de fondo.

Es una abreviatura de las propiedades: border-

border
width, border-style (requerido), border-color.

Es una abreviatura de las propiedades: border-

border-bottom * bottom-width, border-bottom-style, border-
bottom-color.

Establece el color del borde inferior de un

border-bottom-color *
elemento.

border-bottom-left-radius * Define el radio de la esquina inferior izquierda.

border-bottom-right-radius * Define el radio de la esquina inferior derecha.

Establece el estilo del borde inferior de un

border-bottom-style *
elemento

Establece el ancho del borde inferior de un

border-bottom-width *
elemento.

top: Hace referencia al borde superior

En las propiedades marcadas con un
asterisco, bottom es sustituible por top, left y left: Hace referencia al borde izquierdo
right.
right: Hace referencia al borde derecho.
 Establece si los bordes de la tabla deben
border-collapse contraerse en un solo borde o estar separados
como en HTML estándar

Establece el color de los cuatro bordes de un

elemento. Esta propiedad puede tener de uno
border-color a cuatro valores para especificar el color de los
bordes superior, derecha, inferior e izquierda
respectivamente.

Permite especificar una imagen para usarla

border-image
como borde alrededor de un elemento.

Especifica la cantidad en la que el área de la

border-image-outset imagen del borde se extiende más allá del
cuadro del borde.

Especifica si la imagen del borde debe

border-image-repeat
repetirse, redondearse, espaciarse o estirarse.

Especifica cómo dividir la imagen indicada por

border-image-source. La imagen siempre se
border-image-slice
divide en nueve secciones: cuatro esquinas,
cuatro bordes y el medio.

Especifica la ruta a la imagen que se usará

border-image-source como borde (en lugar del borde normal
alrededor de un elemento).

border-image-width Establece el ancho de la imagen del borde.

Define el radio de las esquinas del borde del

border-radius
elemento.

Establece la distancia entre los bordes de las

border-spacing
celdas adyacentes.

Establece el estilo de los cuatro bordes de un

border-style elemento. Esta propiedad puede tener de uno
a cuatro valores.
 Establece el ancho de los cuatro bordes de un
border-width elemento. Esta propiedad puede tener de uno
a cuatro valores.

Afecta a la posición vertical de un elemento

bottom posicionado. Esta propiedad no tiene efecto
en elementos no posicionados.

Especifica como se aplican las propiedades

background, padding, border, border-image,
box-decoration-break box-shadow, margin, y clip-path de un
elemento cuando la caja de un elemento está
fragmentada.

box-shadow Adjunta una o más sombras a un elemento.

Define cómo se calculan el ancho y el alto de

box-sizing un elemento: si deben incluir relleno y bordes,
o no.

Especifica si se debe producir o no un salto de

break-after página, un salto de columna o un salto de
región después del elemento especificado.

Especifica si se debe producir o no un salto de

break-before página, un salto de columna o un salto de
región antes del elemento especificado.

Especifica si se debe producir o no un salto de

break-inside página, un salto de columna o un salto de
región dentro del elemento especificado.

caption-side Especifica la ubicación de un título de tabla

Especifica el color del cursor (signo de

caret-color intercalación) en entradas, áreas de texto o
cualquier elemento que sea editable.

La regla @charset especifica la codificación de

@charset
caracteres utilizada en la hoja de estilo.
 Controla el flujo junto a los elementos
clear
flotantes.

Permite especificar un rectángulo para

recortar un elemento absolutamente
posicionado. El rectángulo se especifica como
clip
cuatro coordenadas, todas desde la esquina
superior izquierda del elemento que se va a
recortar. No funciona con «overflow: visible».

Permite recortar un elemento a una forma

clip-path
básica o a una fuente SVG.

color Establece el color del texto.

Especifica el número de columnas en las que

column-count
se debe dividir un elemento.

Especifica cómo llenar columnas, equilibradas

column-fill
o no.

column-gap Establece el espacio entre las columnas.

Establece el ancho, el estilo y el color de la

column-rule
regla entre columnas.

column-rule-color Especifica el color de la regla entre columnas.

column-rule-style Indica el estilo de la regla entre columnas.

column-rule-width Especifica el ancho de la regla entre columnas.

Especifica cuántas columnas debe abarcar un

column-span
elemento.

column-width Establece el ancho de una columna.

Es una propiedad abreviada para: column-

columns
width, column-count.
 Se utiliza con los pseudo-
content elementos ::before y ::after, para insertar
contenido generado.

Aumenta o disminuye el valor de uno o más

counter-increment
contadores CSS.

counter-reset Crea o restablece uno o más contadores CSS.

Generalmente se usa junto con las

propiedades counter-increment y content.

Especifica el cursor del ratón que se mostrará

cursor
cuando se apunte sobre un elemento.

Especifica la dirección del texto o la dirección

direction de escritura dentro de un elemento a nivel de
bloque. Más información aquí.

Establece el comportamiento de visualización

display (el tipo de cuadro de representación) de un
elemento.

Establece si mostrar o no los bordes en las

empty-cells
celdas vacías de una tabla.

Define efectos visuales (como desenfoque y

filter saturación) a un elemento (a menudo utilizado
para imágenes).

Es una propiedad abreviada para: flex-grow

flex flex-shrink flex-basis Establece la longitud
flexible en elementos flexibles.

Especifica la longitud inicial de un elemento

flex-basis
flexible.
 Esta propiedad indica la dirección de los
flex-direction
elementos flexibles.

Es una abreviatura para las propiedades: flex-

direction, flex-wrap, Si los elementos no son
flex-flow
elementos flexibles, la propiedad de flujo
flexible no tiene efecto.

Especifica cuánto crecerá el elemento en

flex-grow relación con el resto de elementos flexibles
dentro del mismo contenedor.

Establece cómo se encogerá el elemento en

flex-shrink relación con el resto de los elementos flexibles
dentro del mismo contenedor.

La propiedad especifica si los elementos

flex-wrap
flexibles deben ajustarse o no.

Especifica si un elemento debe flotar a la

float
izquierda, a la derecha o no flotar en absoluto.

Los elementos posicionados de manera

absoluta ignoran la propiedad float. Los
elementos junto a un elemento flotante
fluirán a su alrededor. Para evitar esto, use la
propiedad clear.

Es una abreviatura para las propiedades: font-

font style font-variant, font-weight, font-size/line-
height, font-family.

Se deben definir un nombre para la fuente

@font-face (por ejemplo, miFuente), y luego apuntar al
archivo de fuente.

Especifica la fuente de texto para un

elemento. Es posible especificar varios
nombres de fuente como un sistema
font-family
«alternativo». Si el navegador no admite la
primera fuente, prueba con la siguiente
fuente.
 Permite el control sobre características
font-feature-settings
tipográficas avanzadas en fuentes OpenType.

Controla el uso de la información de

font-kerning
interletraje almacenada en una fuente.

font-size Establece el tamaño de una fuente.

Le brinda un mejor control del tamaño de la

fuente cuando la primera fuente seleccionada
no está disponible. Cuando una fuente no está
font-size-adjust disponible, el navegador usa la segunda fuente
especificada. Esto podría resultar en un gran
cambio para el tamaño de fuente. Para evitar
esto, utilice la propiedad font-size-adjust.

Le permite hacer que el texto sea más angosto

font-stretch
(condensado) o más ancho (expandido).

font-style Especifica el estilo de fuente para un texto.

Especifica si un texto debe mostrarse o no en

font-variant
mayúsculas pequeñas.

Controla el uso de glifos alternativos para

font-variant-caps
letras mayúsculas.

Establece qué tan gruesos o delgados deben

font-weight
mostrarse los caracteres del texto.

Define el tamaño del espacio entre las filas y

gap
las columnas.

Es una abreviatura para las propiedades: grid-

template-rows, grid-template-columns, grid-
grid
template-areas, grid-auto-rows, grid-auto-
columns, grid-auto-flow.

Especifica el tamaño y la ubicación de un

grid-area elemento de cuadrícula en un diseño de
cuadrícula y es una propiedad abreviada para
 las siguientes propiedades: grid-row-start,
grid-column-start, grid-row-end, grid-column-
end.

Establece un tamaño para las columnas en un

grid-auto-columns
contenedor grid.

Controla cómo se insertan en la cuadrícula los

grid-auto-flow
elementos colocados automáticamente.

Establece un tamaño para las filas en un

grid-auto-rows
contenedor de cuadrícula.

Especifica el tamaño y la ubicación de un

elemento de cuadrícula en un diseño de
grid-column cuadrícula y es una propiedad abreviada para
las siguientes propiedades: grid-column-start,
grid-column-end.

Define cuántas columnas abarcará un

grid-column-end elemento, o en qué línea de columna
terminará el elemento.

Define el tamaño del espacio entre las

grid-column-gap
columnas en un diseño de cuadrícula.

Define en qué línea de columna comenzará el

grid-column-start
elemento.

Define el tamaño del espacio entre las filas y

las columnas en un diseño de cuadrícula y es
grid-gap
una propiedad abreviada para las siguientes
propiedades: grid-row-gap, grid-column-gap.

Especifica el tamaño y la ubicación de un

elemento de cuadrícula en un elemento grid y
grid-row
es una propiedad abreviada para las siguientes
propiedades: grid-row-start, grid-row-end.

Define cuántas filas abarcará un elemento, o

grid-row-end
en qué línea de fila terminará el elemento
 Define el tamaño del espacio entre las filas en
grid-row-gap
un diseño de cuadrícula.

Define en qué línea de fila comenzará el

grid-row-start
elemento.

Es una propiedad abreviada para las siguientes

grid-template propiedades: grid-template-rows, grid-
template-columns, grid-template-areas.

grid-template-areas Especifica áreas dentro de un elemento grid.

Especifica el número (y el ancho) de las

grid-template-columns
columnas en un diseño grid.

Especifica el número (y las alturas) de las filas

grid-template-rows
en un diseño de cuadrícula.

Especifica si se puede colocar un signo de

puntuación fuera del cuadro de línea al
hanging-punctuation
principio o al final de una línea completa de
texto.

Establece la altura de un elemento. No incluye

height
relleno, bordes o márgenes.

Define si se permite la separación silábica para

hyphens crear más oportunidades de ajuste suave
dentro de una línea de texto.

Especifica el tipo de algoritmo que se utilizará

image-rendering
para escalar la imagen.

Regla que le permite importar una hoja de

@import
estilo a otra hoja de estilo.

Define si un elemento debe crear un nuevo

isolation
contenido de apilamiento.

justify-content Alinea los elementos del contenedor flexible

cuando los elementos no utilizan todo el
 espacio disponible en el eje principal
(horizontalmente).

@keyframes Regla que especifica el código de animación.

Afecta la posición horizontal de un elemento

left posicionado. Esta propiedad no tiene efecto
en elementos no posicionados.

Aumenta o disminuye el espacio entre

letter-spacing
caracteres en un texto.

line-height Especifica la altura de una línea.

Es una abreviatura de las siguientes

list-style propiedades: list-style-type, list-style-position,
list-style-image.

Reemplaza el marcador de elemento de lista

list-style-image
con una imagen.

Especifica la posición de los marcadores de

list-style-position
elementos de lista (viñetas).

Especifica el tipo de marcador de elemento de

list-style-type
lista en una lista.

Establece los márgenes de un elemento y es

una propiedad abreviada para las siguientes
margin
propiedades: margin-top, margin-right,
margin-bottom, margin-left.

margin-bottom Establece el margen inferior de un elemento.

Establece el margen izquierdo de un

margin-left
elemento.

margin-right Establece el margen derecho de un elemento.

margin-top Establece el margen superior de un elemento.

 Especifica una imagen que se utilizará como
mask-image
capa de máscara para un elemento.

Especifica si la imagen de la capa de máscara

mask-mode debe tratarse como una máscara de
luminancia o como una máscara alfa.

Especifica la posición de origen (el área de

mask-origin posición de la máscara) de una imagen de
capa de máscara.

Establece la posición inicial de una imagen de

mask-position máscara (en relación con el área de posición
de la máscara).

Establece sí o cómo se repetirá una imagen de

mask-repeat
máscara.

Especifica el tamaño de la imagen de la capa

mask-size
de máscara.

max-height Define la altura máxima de un elemento.

max-width Define la anchura máxima de un elemento.

La regla se usa para aplicar diferentes estilos

@media
para diferentes tipos de medios/dispositivos.

min-height Define la altura mínima de un elemento.

min-width Define la anchura mínima de un elemento.

Especifica cómo el contenido de un elemento

mix-blend-mode debe combinarse con su fondo principal
directo.

Se utiliza para especificar cómo se debe

object-fit cambiar el tamaño de un <img> o <video>
para que se ajuste a su contenedor.
 Se usa junto con object-fit para especificar
cómo se debe colocar un <img> o <video> con
object-position
las coordenadas x/y dentro de su «propio
cuadro de contenido».

opacity Establece el nivel de opacidad de un elemento.

Especifica el orden de un artículo flexible en

order relación con el resto de los artículos flexibles
dentro del mismo contenedor.

Especifica el número mínimo de líneas que se

orphans
deben dejar al final de una página o columna.

Es una propiedad abreviada para: outline-

outline
width, outline-style (obligatoria), outline-color.

outline-color Especifica el color de un contorno

Agrega espacio entre el contorno y el borde o

outline-offset
borde de un elemento.

outline-style Especifica el estilo de un outline.

outline-width Especifica el ancho de un contorno.

Especifica lo que debería suceder si el

overflow contenido desborda el cuadro de un
elemento.

Especifica si el navegador puede o no dividir

overflow-wrap líneas con palabras largas, si desbordan el
contenedor.

Especifica si se agrega una barra de

desplazamiento o se muestra el contenido de
overflow-x desbordamiento de un elemento de nivel de
bloque, cuando se desborda en los ejes
izquierdos y derechos.
 Especifica si se agrega una barra de
desplazamiento o se muestra el contenido de
overflow-y desbordamiento de un elemento de nivel de
bloque, cuando se desborda en los ejes
inferiores y superiores.

El padding de un elemento es el espacio entre

su contenido y su borde. Es una propiedad
padding
abreviada para: padding-top, padding-right,
padding-bottom, padding-left.

Establece el padding inferior (espacio) de un

padding-bottom
elemento.

Establece el padding inferior (espacio) de un

padding-left
elemento.

Establece el padding inferior (espacio) de un

padding-right
elemento.

Establece el padding inferior (espacio) de un

padding-top
elemento.

Agrega un salto de página después de un

page-break-after
elemento especificado.

Agrega un salto de página antes de un

page-break-before
elemento especificado.

Establece si se debe evitar un salto de página

page-break-inside
dentro de un elemento específico.

Se utiliza para dar cierta perspectiva a un

perspective
elemento posicionado en 3D.

Define desde qué posición el usuario está

perspective-origin
mirando el elemento posicionado en 3D.

Define si un elemento reacciona o no a los

pointer-events
eventos de puntero.
 Especifica el tipo de método de
position posicionamiento utilizado para un elemento
(estático, relativo, absoluto, fijo o pegajoso).

quotes Establece el tipo de comillas para las citas.

Define si (y cómo) el usuario puede cambiar el

resize
tamaño de un elemento.

Afecta la posición horizontal de un elemento

right posicionado. Esta propiedad no tiene efecto
en elementos no posicionados.

Especifica el espacio entre las filas de la

row-gap
cuadrícula.

Especifica si animar suavemente la posición de

desplazamiento, en lugar de un salto directo,
scroll-behavior
cuando el usuario hace clic en un enlace
dentro de un cuadro desplazable.

Especifica el ancho de un carácter de

tab-size
tabulación.

Define el algoritmo utilizado para diseñar las

table-layout
celdas, filas y columnas de la tabla.

Indica la alineación horizontal del texto en un

text-align
elemento.

Especifica cómo alinear la última línea de un

text-align-last
texto

Especifica la decoración añadida al texto y es

una propiedad abreviada para: text-
text-decoration
decoration-line (obligatorio), text-decoration-
color, text-decoration-style.

Especifica el color de la decoración del texto

text-decoration-color
(subrayado, sobre-rayado, líneas continuas).
 Establece el tipo de decoración de texto que
text-decoration-line se utilizará (como subrayado, sobre-rayado,
traspaso).

Establece el estilo de la decoración del texto

text-decoration-style (como sólido, ondulado, punteado,
discontinuo, doble).

Indica la sangría de la primera línea en un

text-indent
bloque de texto.

Especifica el método de justificación del texto

text-justify
cuando text-align se establece en «justify».

Especifica cómo se debe señalar al usuario el

text-overflow
contenido desbordado que no se muestra.

text-shadow Agrega sombra al texto.

text-transform Controla las mayúsculas del texto

Afecta a la posición vertical de un elemento

top posicionado. Esta propiedad no tiene efecto
en elementos no posicionados.

Aplica una transformación 2D o 3D a un

transform
elemento.

Le permite cambiar la posición de los

transform-origin
elementos transformados.

Especifica cómo se representan los elementos

transform-style
anidados en el espacio 3D.

Es una propiedad abreviada para: transition-

transition property, transition-duration, transition-
timing-function, transition-delay.

Indica cuándo comenzará el efecto de

transition-delay
transición.
 Especifica cuántos segundos (s) o milisegundos
transition-duration (ms) tarda en completarse un efecto de
transición.

Indica el nombre de la propiedad CSS para el

efecto de transición (el efecto de transición
transition-property
comenzará cuando cambie la propiedad CSS
especificada).

Especifica la curva de velocidad del efecto de

transition-timing-function
transición.

Se usa junto con la propiedad direction para

establecer o devolver si el texto debe anularse
unicode-bidi
para admitir varios idiomas en el mismo
documento.

Especifica si se puede seleccionar el texto de

user-select
un elemento.

Establece la alineación vertical de un

vertical-align
elemento.

visibility Indica si un elemento es visible o no.

Especifica cómo se maneja el espacio en

white-space
blanco dentro de un elemento.

Especifica el número mínimo de líneas que se

widows deben dejar en la parte superior de una página
o columna.

width Establece el ancho de un elemento.

Especifica cómo deben dividirse las palabras al

word-break
llegar al final de una línea.

Aumenta o disminuye el espacio en blanco

word-spacing
entre las palabras
 Permite que las palabras largas se puedan
word-wrap
dividir y pasar a la siguiente línea.

Especifica si las líneas de texto se disponen

writing-mode
horizontal o verticalmente.

Especifica el orden de apilamiento de un

elemento. Un elemento con mayor orden de
z-index
apilamiento siempre está delante de un
elemento con menor orden de apilamiento.