Guía de Referencia de CSS

Listado de todas las propiedades de CSS.


Guía de las Propiedades de CSS


Esta página comprende un resumen de cada una de las propiedades de CSS, con sus respectiva descripción y los posibles valores de las mismas.

Todas las propiedades están agrupadas de acuerdo al tipo de propiedad y ordenadas como lo estuvieron a lo largo de todo el tutorial.


Bordes

PropiedadDescripciónValores
border Ancho, color y estilo para los 4 bordes. thin
medium
thick
longitud
color

transparent
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
border-top
border-right
border-bottom
border-left
Ancho, color y estilo para los bordes superior, derecho, inferior, izquierdo.
border-width Ancho de los 4 bordes. thin
medium
thick
longitud
border-top-width
border-right-width
border-bottom-width
border-left-width
Ancho del borde superior, derecho, inferior, izquierdo.
border-color Color de los 4 bordes. color
transparent
border-top-color
border-right-color
border-bottom-color
border-left-color
Color del borde superior, derecho, inferior, izquierdo.
border-style Estilo de los 4 bordes. none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
border-top-style
border-right-style
border-bottom-style
border-left-style
Estilo del borde superior, derecho, inferior, izquierdo.

Contenido Generado

PropiedadDescripciónValores
content Agregador de contenido para los pseudo elementos ":after y :before". normal
none
texto
URL

contador
attr(x)
open-quote
close-quote
no-open-quote
no-close-quote
quotes Especifica las marcas para indicar las citas. texto
none
counter-reset Inicializa un contador. identificador entero
none
counter-increment Incrementa un contador. identificador entero
none

Dimensiones

PropiedadDescripciónValores
width Ancho. longitud
%

auto
min-width Ancho mínimo. longitud
%
max-width Ancho máximo. longitud
%

none
height Alto. longitud
%

auto
min-height Alto mínimo. longitud
%
max-height Alto máximo. longitud
%

none
line-height Altura entre las bases del texto. normal
número
longitud
%

Efectos Visuales

PropiedadDescripciónValores
overflow Comportamiento del contenido si se desborda en la caja. visible
hidden
scroll
auto
clip Especifica la región visible del elemento. rect(long.superior, long.derecha, long.inferior, long.izquierda)
auto
display Comportamiento del contenedor. inline
block
list-item
run-in
inline-block
table
inline-table
table-row-group
table-header-group
table-footer-group
table-row
table-column-group
table-column
table-cell
table-caption
none
visibility Visibilidad de las cajas. visible
hidden
collapse

Fondo

PropiedadDescripciónValores
background Propiedades individuales relacionadas con el fondo. background-color
background-image
background-repeat
background-attachment
background-position
background-color Color de fondo. color
transparent
background-image Imagen de fondo. URL
none
background-repeat Repetición de la imagen de fondo. repeat
repeat-x
repeat-y
no -repeat
background-attachment Desplazamiento de la imagen de fondo. scroll
fixed
background-position Posición de la imagen de fondo. %
longitud

left
center
right
top
bottom

Fuentes

PropiedadDescripciónValores
font Atajo para establecer el resto de propiedades sobre las fuentes a la vez. font-style
font-variant
font-weight
font-size
font-family
line height
caption
icon
menu
message-box
small-caption
status-bar
font-family Familias de fuentes. nombre-familia
familia-genérica
font-style Estilo de la fuente. normal
italic
oblique
font-variant Convierte las minúsculas a mayúsculas pero mantienen un tamaño inferior a las mayúsculas. normal
small-caps
font-weight Intensidad de la fuente. normal
bold
bolder
lighter
100
200
300
400
500
600
700
800
900
font-size Tamaño de la fuente. xx-small
x-small
small
medium
large
x-large
xx-large
larger
smaller
longitud
%

Contornos

PropiedadDescripciónValores
outline Propiedades individuales del contorno. outline-color
outline-style
outline-width
outline-width Ancho del contorno. thin
medium
thick
longitud
outline-style Estilo del contorno. none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
outline-color Color del contorno. color
invert

Listas

PropiedadDescripciónValores
list-style Permite establecer el estilo de la lista, la imagen y/o la posición. list-style-type
list-style-position
list-style-image
list-style-type Estilo aplicable a los marcadores visuales de las listas. disc
circle
square
decimal
decimal-leading-zero
lower-roman
upper-roman
lower-greek
lower-latin
upper-latin
armenian
georgian
lower-alpha
upper-alpha
none
list-style-image Imagen aplicable a los elementos de las listas. URL
none
list-style-position Posición dentro de la lista de los elementos marcadores de las listas. inside
outside

Márgenes

PropiedadDescripciónValores
margin Ancho para varios márgenes individuales. longitud
%

auto
margin-top
margin-right
margin-bottom
margin-left
Tamaño del margen superior, derecho, inferior e izquierdo. longitud
%

auto

Ubicación

PropiedadDescripciónValores
position Esquema de posicionamiento. static
relative
absolute
fixed
top
right
bottom
left
Desplazamiento de la caja(respecto al límite superior, derecho, inferior o izquierdo del contenedor). longitud
%

auto
float Posicionamiento flotante. left
right
none
clear Control de cajas adyacentes a los float. none
left
right
both
vertical-align Alineación vertical del texto. baseline
sub
super
top
text-top
middle
bottom
text-bottom
longitud
%
z-index Solapamiento de niveles de capas. entero con signo
auto

Relleno

PropiedadDescripciónValores
padding Tamaños para varios rellenos individuales. longitud
%
padding-top
padding-right
padding-bottom
padding-left
Ancho del relleno superior, derecho, inferior e izquierdo. longitud
%

Tablas

PropiedadDescripciónValores
caption-side Posición del título respecto de la tabla. top
bottom
table-layout Control del algoritmo usado para el formato de las celdas, filas y columnas. auto
fixed
border-collapse Selección del modelo de los bordes. collapse
separate
border-spacing Espaciado entre los bordes de celdas adyacentes. longitud
empty-cells Visibilidad de los bordes de celdas sin contenido. show
hide

Texto

PropiedadDescripciónValores
text-indent Desplazamiento de la primera línea del texto. longitud
%
text-align Alineamiento del texto. left
right
center
justify
text-decoration Efectos de subrayado, tachado, parpadeo. none
underline
overline
line-through
blink
text-transform Transformaciones del texto a mayúsculas/minúsculas. capitalize
uppercase
lowercase
none
letter-spacing Espacio entre caracteres. normal
longitud
word-spacing Espacio entre palabras. normal
longitud
white-space Comportamiento de los espacios dentro de los elementos. normal
pre
nowrap
pre-wrap
pre-line
color Color del primer plano. color
direction Sentido direccional de la escritura. ltr
rtl
unicode-bidi Sentido direccional de la escritura. normal
embed
bidi-override

Pseudo Clases

PropiedadDescripción
:link Enlaces no visitados.
:visited Enlaces visitados.
:active Cuando es activado(tiempo entre que se pulsa un botón sobre él y se suelta).
:hover Cuando se posiciona el cursor sobre él pero no se activa.
:focus Cuando tiene el foco posicionado sobre él.
:lang Especifica el lenguaje usado en el elemento.
:first-child Cuando es el primer hijo de un elemento padre.

Pseudo Elementos

PropiedadDescripción
:first-line Primera línea de un texto.
:first-letter Pimera letra de un texto.
:before Inserta un contenido antes del elemento.
:after Inserta un contenido después del elemento.


<<< Examen de CSS Tipos de Medios de CSS >>>

En la Web