Guia de Referencia Rápida CSS 2.1 de La W3C

Gua de Referencia Rpida CSS 2.
1 de 7
http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/
Gua de Referencia CSS [C

S
*
Patrn
Aplicado a:
Cualquier elemento
N/D [N
Elemento <e>
<e>
Cualquier <f> que es hijo de <e>
e > f
<f> si est precedido inmediatamente por un <e>
Ejemplo
]
...</e> <f>...<f>
<e miAtr="xxx".../>
<e> si posee el atributo "miAtr" y este tiene el valor "v"
e[miAtr="v"]
2.1
<f><e></e>...</f>
<e> si posee el atributo "miAtr"
e[miAtr]
<e>...<f>...</f>...</e>
e:first-child <e> cuando es el primer hijo de su elemento padre

e + f
<e>...<d>...<f/>...
</d>...</e>
Cualquier <f> que est incluido en <e>
e f
<e miAtr="v".../>
e[miAtr~="v"] <e> si su atributo "miAtr" es una lista de valores separados por espacios y uno es "v" <e miAtr="x y z v".../>
e[lang|="es"]
<e> si su atributo "lang" es una lista de valores separados por guiones y comienza con
<e lang="es-ES" .../>
"es"
e.miClase
<e> cuya clase es "miClase"
<e class="miClase".../>
a:link
Enlaces no visitados
N/D
<e> cuando es activado (tiempo entre que se pulsa un botn sobre l y se suelta)
N/D
<e> cuando tiene el foco posicionado en l
N/D
e#miId
a:visited
e:active
e:hover
e:focus
<e> cuyo identificador es miId
<e id="miId".../>
Enlaces visitados
<e> cuando se posiciona el cursor sobre l pero no se activa
N/D
N/D
e:lang(c)
<e> si est marcado con el idioma c
e:firstletter
Primera letra de <e>
N/D
Aplica contenido despus del elemento <e>
N/D
e:first-line
e:before
e:after
e , f
N
a b
Patrn
N/D
Aplica el mismo contenido a los elementos <e> y <f>
N/D
Descripcin
all
Todos los dispositivos
aob
embossed
Impresoras braille
[ a || b ]
a o b o ambos
braille
handheld
a es opcional
print
a*
0 o varios a
a {n, m}
a como mnimo n veces y como

mximo m
a+
Nombre
a seguido de b
a y b agrupados
a?
N/D
Aplica contenido antes de <e>
( a b )
[ a | b ]
N/D
Primera lnea de <e>
projection
1 o varios a
screen
speech
tty
tv
Dispositivos tctiles braille

Dispositivos de mano (pantallas pequeas, ancho de banda reducido, etc.)
Para documentos paginados y mostrados en vista de impresin
Dispositivos de proyeccin de presentaciones
Pantallas a color de equipos informticos
Para sintetizadores de voz. Similar a "aural"
Dispositivos de visualizacin con capacidades limitadas

Televisores
px Pxeles (relativo al dispositivo)

em Tamao de la fuente actual
ex Alto del caracter 'x'
Medio
%
0
Porcentaje
No requiere unidad
17/03/2016 03:39 p. m.
Gua de Referencia Rpida CSS 2.1
2 de 7
@import "hoja.css" tipo-medio;

/* Comentarios */
@media tipo-medio {
selector {
propiedad: valor-es;
}
}
in
Pulgadas (1pulgada = 2.54 cm

])
[C
cm Centmetros
#RGB
mm Milmetros
pt Puntos (1pt = 1/72pulgadas)

pc Picas (1pica = 12 puntos)
Propiedad
margin-top
margin-right
margin-bottom
margin-left
margin
Propiedad
padding-top
padding-right
padding-bottom
padding-left
padding
Propiedad
#RRGGBB
Descripcin
rgb(R,G,B)
Color RGB [R G
hexadecimales)
] (6 Valores
Notacin simplificada (#RGB =

#RRGGBB)
Color RGB (3 valores de 0 a 255)
rgb(R%,G%,B%) Color RGB (3 valores porcentuales)
Descripcin
Valores
Tamao del margen

superior, derecho,
inferior e izquierdo
[ <longitud> | <porcentaje> |
auto ]
Ancho para varios

mrgenes individuales
[ <longitud> | <porcentaje> |
auto ]{1,4}
Valores
Ancho del relleno superior, derecho, inferior e

[ <longitud> | <porcentaje> ]
izquierdo
Tamaos para varios rellenos individuales
Descripcin
[ <longitud> | <porcentaje> ] {1,4}

Valores
border-top-width
border-right-width
Anchura del borde superior, derecho, inferior
[ thin | medium | thick | <longitud> ]
border-bottom-width o izquierdo
border-left-width
border-width
Anchos de varios bordes individuales
border-top-color
border-right-color
Color del borde superior, derecho, inferior o
border-bottom-color izquierdo
border-left-color
border-color
Colores de varios bordes individuales
border-top-style
border-right-style
Estilo del borde superior, derecho, inferior o
border-bottom-style izquierdo
border-left-style
border-style
border-top
border-right
border-bottom
border-left
border
[ thin | medium | thick | <longitud> ] {1,4}

[ <color> | transparent ]
[ <color> | transparent ] {1,4}
[ none | hidden | dotted | dashed | solid | double |
groove | ridge | inset | outset ]
Estilos de varios bordes individuales
[ none | hidden | dotted | dashed | solid | double |

groove | ridge | inset | outset ] {1,4}
Ancho, estilo y el color para el borde

superior, derecho, inferior o izquierdo
[ <border-top-width> || <border-top-style> || <bordertop-color> ]
Ancho, el estilo y el color para los 4 bordes
[ <border-top-width> || <border-top-style> || <bordertop-color> ]
17/03/2016 03:39 p. m.
3 de 7
Propiedad
Descripcin
Valores
[ inline | block | list-item | run-in | inline-block |

table | inline-table | table-row-group | tableheader-group | table-footer-group | table-row | tablecolumn-group | table-column | table-cell | tablecaption | none ]
display
Comportamiento del contenedor
position
Esquema de posicionamiento
float
Posicionamiento flotante
[ left | right | none ]
z-index
Solapamiento de niveles de capas
[ auto | <entero_con_signo> ]
top
right
bottom
left
clear
direction
unicode-bidi
[ static | relative | absolute | fixed ]
Desplazamiento de la caja (respecto al lmite

[ <longitud> | <porcentaje> | auto ]
superior, derecho, inferior o izquierdo del
contenedor)
Control de cajas adyacentes a los float
Sentido direccional de la escritura
Sentido direccional de la escritura
[ none | left | right | both ]

[ ltr | rtl ]
[ normal | embed | bidi-override ]
17/03/2016 03:39 p. m.
4 de 7
D
width
Propiedad
Alto mximo
max-height
Altura entre las bases del texto
line-height
vertical-align
Propiedad
overflow
Alineacin vertical del texto
visibility
Propiedad
content
counter-reset
counter-increment
list-style-type
list-style-image
list-style-position
list-style
background-color
background-image
background-repeat
backgroundattachment
Valores
Visibilidad de las cajas
[ visible | hidden | collapse ]
Descripcin
[ rect (<longitud>, <longitud>, <longitud>, <longitud>)

| auto ]
Valores
Agregador de contenido para :after y

:before
[ normal | none | [ <texto> | <uri> | <contador> |

attr(X) | open-quote | close-quote | no-open-quote |
no-close-quote]+ ]
Inicializa un contador
[ [ <identificador> <entero>? ]+ | none ]
Incrementa un contador
[ [ <texto> <texto> ]+ | none ]
[ [ <identificador> <entero>? ]+ | none ]
[ disc | circle | square | decimal | decimalEstilo aplicable a los marcadores visuales de leading-zero | lower-roman | upper-roman | lower-greek
| lower-latin | upper-latin | armenian | georgian |
las listas
lower-alpha | upper-alpha | none ]
Imagen aplicable a los elementos de las
listas
Posicin dentro de la lista de los elementos

marcadores de las listas
Permite establecer el estilo de la lista, la
imagen y/o la posicin
Descripcin
[ url("http://...") | none ]
[ inside | outside ]
[ <list-style-type> || <list-style-position> || <liststyle-image> ]
Color del primer plano
<color>
Imagen de fondo
[ url(...) | none ]
Color de fondo
Repeticin de la imagen de fondo

Desplazamiento de la imagen de fondo
background-position Posicin de la imagen de fondo

background
[ baseline | sub | super | top | text-top | middle |

bottom | text-bottom | <porcentaje> | <longitud> ]
[ visible | hidden | scroll | auto ]
Propiedad
[ normal | <nmero> | <longitud> | <porcentaje> ]
Comportamiento del contenido si se

desborda en la caja
Especifica las marcas para indicar las citas
quotes
[ <longitud> | <porcentaje> | none ]
Descripcin
Especifica la regin visible del elemento
clip
color
Alto mnimo
min-height
[ <longitud> | <porcentaje> | none ]
Alto
height
Valores

Ancho mximo
max-width
Descripcin
Ancho
Ancho mnimo
min-width
Valores
[ <color> | transparent ]
[ repeat | repeat-x | repeat-y | no-repeat ]
[ scroll | fixed ]
[ [ <porcentaje> | <longitud> | left | center | right ]

[ <porcentaje> | <longitud> | top | center | bottom]? ]
| [ [ left | center | right ] || [ top | center |
bottom ] ]
[ <background-color> || <background-image> ||
Propiedades individuales relacionadas con el
<background-repeat> || <background-attachment> ||
fondo
<background-position> ]
17/03/2016 03:39 p. m.
5 de 7
Propiedad
Descripcin
Valores
page-break-before
Gestionar saltos de pgina antes del elemento
[ auto | always | avoid | left | right ]
page-break-inside
Evita los saltos de lnea en el interior del elemento
[ avoid | auto ]
page-break-after
orphans
widows
Gestionar saltos de pgina posterior al elemento
Mnimo nmero de lneas de un prrafo que deben ser

dejadas como mnimo al final de una pgina
Mnimo nmero de lneas de un prrafo que deben ser
dejadas como mnimo al principio de una pgina
[ auto | always | avoid | left | right ]

<entero>
<entero>
17/03/2016 03:39 p. m.
6 de 7
Propiedad
Descripcin
Valores
[ [ <nombre-familia> | <familia-genrica> ] [, <nombrefamilia> | <familia-genrica> ]* ]
font-family
Familias de fuentes
font-variant
Convierte las minsculas a maysculas pero

[ normal | small-caps ]
mantienen un tamao inferior a las
maysculas
font-style
Estilo de la fuente
[ normal | italic | oblique ]
[ normal | bold | bolder | lighter | 100 | 200 | 300 |

400 | 500 | 600 | 700 | 800 | 900 ]
font-weight
Intensidad de la fuente
font-size
Tamao de la fuente
font
[ [ [ <font-style> || <font-variant> || <font-weight>

Atajo para establecer el resto de propiedades ]? <font-size> [ / <line-height> ]? <font-family> ] |
caption | icon | menu | message-box | small-caption |
sobre las fuentes a la vez
status-bar ]
Propiedad
[ [ xx-small | x-small | small | medium | large |

x-large | xx-large] | [larger | smaller] | <longitud> |
<porcentaje> ]
Descripcin
Valores
text-indent
Desplazamiento de la primera lnea del texto [ <longitud> | <porcentaje> ]
text-decoration
Efectos de subrayado, tachado, parpadeo
word-spacing
Espacio entre palabras
Alineamiento del texto
[ left | right | center | justify ]
letter-spacing
Espacio entre caracteres
[ normal | <longitud> ]
text-transform
Transformaciones del texto a

maysculas/minsculas
text-align
white-space
Propiedad
Comportamiento de los espacios dentro de

los elementos
Descripcin
caption-side
Posicin del ttulo de respecto la tabla
border-collapse
Seleccin del modelo de los bordes
table-layout
Control del algoritmo usado para el formato

de las celdas, filas y columnas
border-spacing
Espaciado entre los bordes de celdas

adyacentes
empty-cells
Propiedad
Visibilidad de los bordes de celdas sin

contenido
Descripcin
cursor
Especifica el cursor
outline-width
Ancho de la lnea exterior
outline-color
Color de la lnea exterior
outline-style
outline
speak-header
Estilo de la lnea exterior
Propiedades individuales de la lnea exterior.
[ none | [ underline || overline || line-through ||

blink ] ]
[ normal | <longitud> ]
[ capitalize | uppercase | lowercase | none ]

[ normal | pre | nowrap | pre-wrap | pre-line ]
[ top | bottom ]
Valores
[ auto | fixed ]
[ collapse | separate ]
<longitud> <longitud>?
[ show | hide ]
Valores
[ [http://.../cursor.ico,]* [ auto | crosshair |

default | pointer | move | e-resize | ne-resize |
nw-resize | n-resize | se-resize | sw-resize | s-resize
| w-resize | text | wait | help | progress ] ]
<border-width>
<border-style>
[ <color> | invert ]
[ <outline-color> || <outline-style> || <outline-width>

]
(Aural) Indica si las cabeceras de la tabla se

[ once | always ]
leen antes de cada celda
Especificacin de CSS2.1: [http://www.w3.org/TR/CSS21]
Oficina Espaola W3C: [http://www.w3c.es]
17/03/2016 03:39 p. m.
7 de 7
Copyright 1994-2016 W3C [W
W
W C
] (MIT [M
I
T
] , ERCIM [E
R
C
] , Keio, Beihang), Todos los derechos reservados. Son aplicables las reglas de responsabilidad, marcas registradas, utilizacin de documentos y licencias de softw are. Las
interacciones con este sitio estn de acuerdo con nuestra declaracin de privacidad de usuarios y miembros.
17/03/2016 03:39 p. m.

Guia de Referencia Rápida CSS 2.1 de La W3C

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Guia de Referencia Rápida CSS 2.1 de La W3C

Transféré par

Droits d'auteur :

Formats disponibles

Gua de Referencia Rpida CSS 2.

Gua de Referencia CSS [C

Cualquier <f> que es hijo de <e>

<f> si est precedido inmediatamente por un <e>

<e> si posee el atributo "miAtr" y este tiene el valor "v"

<e> si posee el atributo "miAtr"

e:first-child <e> cuando es el primer hijo de su elemento padre

Cualquier <f> que est incluido en <e>

<e> cuya clase es "miClase"

<e> cuando tiene el foco posicionado en l

<e> cuyo identificador es miId

<e> cuando se posiciona el cursor sobre l pero no se activa

<e> si est marcado con el idioma c

Primera letra de <e>

Aplica contenido despus del elemento <e>

Aplica el mismo contenido a los elementos <e> y <f>

Todos los dispositivos

a como mnimo n veces y como

Aplica contenido antes de <e>

Primera lnea de <e>

Dispositivos tctiles braille

Para sintetizadores de voz. Similar a "aural"

Dispositivos de visualizacin con capacidades limitadas

px Pxeles (relativo al dispositivo)

Gua de Referencia Rpida CSS 2.1

@import "hoja.css" tipo-medio;

Pulgadas (1pulgada = 2.54 cm

pt Puntos (1pt = 1/72pulgadas)

Notacin simplificada (#RGB =

Color RGB (3 valores de 0 a 255)

rgb(R%,G%,B%) Color RGB (3 valores porcentuales)

Tamao del margen

Ancho para varios

Ancho del relleno superior, derecho, inferior e

[ <longitud> | <porcentaje> ] {1,4}

Anchos de varios bordes individuales

Colores de varios bordes individuales

[ thin | medium | thick | <longitud> ] {1,4}

Estilos de varios bordes individuales

[ none | hidden | dotted | dashed | solid | double |

Ancho, estilo y el color para el borde

[ <border-top-width> || <border-top-style> || <bordertop-color> ]

Ancho, el estilo y el color para los 4 bordes

[ <border-top-width> || <border-top-style> || <bordertop-color> ]

Gua de Referencia Rpida CSS 2.1

[ inline | block | list-item | run-in | inline-block |

Comportamiento del contenedor

[ left | right | none ]

Solapamiento de niveles de capas

[ static | relative | absolute | fixed ]

Desplazamiento de la caja (respecto al lmite

[ none | left | right | both ]

[ normal | embed | bidi-override ]

Gua de Referencia Rpida CSS 2.1

Altura entre las bases del texto

Alineacin vertical del texto

Visibilidad de las cajas

[ visible | hidden | collapse ]

[ rect (<longitud>, <longitud>, <longitud>, <longitud>)

Agregador de contenido para :after y

[ normal | none | [ <texto> | <uri> | <contador> |

[ [ <identificador> <entero>? ]+ | none ]

[ [ <texto> <texto> ]+ | none ]