css3

Guía de Referencia CSS [C

ASCADING

STYLE SHEETS]

2.1

SELECTORES
Patrón

Aplicado a:

Ejemplo

*

Cualquier elemento

e

Elemento

N/D [NO DISPONIBLE]


e f

Cualquier que esté incluido en

............

e > f

Cualquier que es hijo de

.........

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

...

e + f

si está precedidoinmediatamente por un

... ...

e[miAtr]

si posee el atributo "miAtr"



e[miAtr="v"] si posee el atributo "miAtr" y este tiene el valor "v"



e[miAtr~="v"] si su atributo "miAtr" es una lista de valores separados por espacios y uno es "v"



e[lang|="es"] si su atributo "lang" es una lista de valores separados por guiones y comienza con "es"



e.miClase

cuya clase es"miClase"



e#miId

cuyo identificador es miId



a:link

Enlaces no visitados

N/D

a:visited

Enlaces visitados

N/D

e:active

cuando es activado (tiempo entre que se pulsa un botón sobre él y se suelta)

N/D

e:hover

cuando se posiciona el cursor sobre él pero no se activa

N/D

e:focus

cuando tiene el foco posicionado en él

N/D

e:lang(c)

siestá marcado con el idioma c

N/D

e:first-line Primera línea de

N/D

e:firstletter

Primera letra de

N/D

e:before

Aplica contenido antes de

N/D

e:after

Aplica contenido después del elemento

N/D

e , f

Aplica el mismo contenido a los elementos y

N/D

NOTACIÓN

TIPOS

Patrón

Descripción

DE

M EDIOS

Nombre

Medio

a b

a seguido deb

all

Todos los dispositivos

( a b )

a y b agrupados

braille

Dispositivos táctiles braille

[ a | b ]

aob

embossed

Impresoras braille

[ a || b ]

a o b o ambos

handheld

Dispositivos de mano (pantallas pequeñas, ancho de banda reducido, etc.)

a?

a es opcional

print

Para documentos paginados y mostrados en vista de impresión

a*

0 o varios aprojection

Dispositivos de proyección de presentaciones

a+

1 o varios a

screen

Pantallas a color de equipos informáticos

a {n, m}

a como mínimo n veces y como máximo m

speech

Para sintetizadores de voz. Similar a "aural"

tty

Dispositivos de visualización con capacidades limitadas

tv

Televisores

SINTAXIS
@import "hoja.css" tipo-medio;

UNIDADES
pxPíxeles (relativo al dispositivo)

%

Porcentaje

em Tamaño de la fuente actual

0

No requiere unidad

ex Alto del caracter 'x'
#RRGGBB
Pulgadas (1pulgada = 2.54 cm
in
[CENTÍMETROS] )

Color RGB [RED GREEN BLUE] (6 Valores
hexadecimales)

#RGB

Notación simplificada (#RGB = #RRGGBB)

cm Centímetros

rgb(R,G,B)

Color RGB (3 valores de 0 a 255)

mm Milímetrosrgb(R%,G%,B%) Color RGB (3 valores porcentuales)

/* Comentarios */
@media tipo-medio {
selector {
propiedad: valor-es;
}
}

pt Puntos (1pt = 1/72pulgadas)
pc Picas (1pica = 12 puntos)

M ODELO

DE

CAJAS

M ÁRGENES
Propiedad

Descripción

Valores

margin-top
margin-right
margin-bottom
margin-left

Tamaño del margen
[ | | auto
superior, derecho, inferior ]
e izquierdomargin

Ancho para varios
márgenes individuales

[ | | auto
]{1,4}

RELLENO
Propiedad

Descripción

Valores

padding-top
padding-right
padding-bottom
padding-left

Ancho del relleno superior, derecho, inferior e
[ | ]
izquierdo

padding

Tamaños para varios rellenos individuales

[ | ] {1,4}

BORDES
Propiedad

Descripción

Valores

border-top-widthborder-right-width Anchura del borde superior, derecho, inferior o
[ thin | medium | thick | ]
border-bottom-width 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...