Está en la página 1de 7

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;
}
}

http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

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.

Gua de Referencia Rpida CSS 2.1

3 de 7

Propiedad

http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

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.

Gua de Referencia Rpida CSS 2.1

4 de 7

D
width

Propiedad

[ <longitud> | <porcentaje> ]

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

[ <longitud> | <porcentaje> | auto ]

Alto mnimo

min-height

[ <longitud> | <porcentaje> | none ]

Alto

height

Valores

[ <longitud> | <porcentaje> | auto ]


[ <longitud> | <porcentaje> ]

Ancho mximo

max-width

Descripcin

Ancho

Ancho mnimo

min-width

http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

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.

Gua de Referencia Rpida CSS 2.1

5 de 7

Propiedad

http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

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.

Gua de Referencia Rpida CSS 2.1

6 de 7

Propiedad

http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

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.

Gua de Referencia Rpida CSS 2.1

7 de 7

Copyright 1994-2016 W3C [W

http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

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.