Apndice B: Referencia CSS

B-1

APNDICE B Referencia CSS (versin 2) CMO CAMBIAR LOS ATRIBUTOS DE LAS ETIQUETAS Para cambiar todo el documento incluir en :

BODY { background:yellow; font-size:10pt; } P { margin-left:0.5in; }

Para definir los estilos en un fichero externo incluir en :

Para cambiar una etiqueta en concreto:

Para cambiar toda una seccin:

Para elementos pequeos dentro de un bloque:

palabra

Desarrollo de Aplicaciones Web con Software Libre

B-2

LISTA DE ATRIBUTOS Muchas unidades expresan un tamao o distancia. En tal caso podemos usar las siguientes unidades: pt=puntos / in=pulgadas /cm=centmetros / px= pixels / %=tanto por cien de quien lo contiene:

margin-left: 10pt; margin-right: 10cm; margin-top: 10px; margin-botton: 10%;

GENERAL:

color: se indica el nombre del color o un cdigo RGB en hexadecimal (red, yellow, #FF0000, )

cursor: tipo de cursor al entrar en el elemento (crosshair/default/ hand/move/text/wait/help)

display: Tipo de representacin (block/inline/list-item/none) overflow: qu hacer con el contenido que no puede visualizarse

(visible/hidden/scroll/auto) visibility: (visible/hidden)

FUENTES: font-family: tipo de fuente (Arial/Courier/Impact/) font-size: tamao de la fuente (pt, in, cm, px)

font-weight: espesor de la fuente ([100-900]/ extra-light/light/ demi-light/medium/demi-bold/bold/extrabold)

font-style: (normal/italic) TEXTO: text-aling: justificacion del texto (left/center/right/justify) vertical-align: justificacin vertical (top/middle/bottom) text-indent: establece el indentado de primera lnea (pt/in/cm/px) line-height: distancia entre lineas (pt/in/cm/px/%) letter-spacing: espacio entre caracteres word-spacing: espacio entre palabras text-decoration: (none/underline/overline/line-through/blink) text-transform: (capitalize/lowercase/uppercase) BORDES: border: dibuja borde (solid/double/none) border-top: borde superior (solid/double/none) border-right: borde derecho (solid/double/none) border-left: borde izq de la pantalla (solid/double/none) border-bottom: borde inferior (solid/double/none) border-width: grosor de borde border-style:(dashed/dotted/double/groove/inset/outset/ridge/solid/none) border-color: Color del borde

Apndice B: Referencia CSS

B-3

MRGENES: margin: mrgenes superior/derecho/izquierdo (margin:20px 10px 10px) margin-left: margen izquierdo margin-right: margen derecho margin-top: margen superior margin-botton: margen inferior padding: distancia del borde al contenido padding-top: padding-right: padding-bottom: padding-left: POSICIN: float: contenido flotante (left/right) clear: (both/left/right/none) left: posicin desde la izquierda (auto/(pt, in, cm, px)) top: posicin desde arriba (auto/(pt, in, cm, px)) position: (static/relative/absolute) z-index: posicin de profundidad (auto/(nmero desde arriba)) FONDO: background-color: color de fondo background-image: URL de la imagen de fondo

background-repeat: si la imagen de fondo se repite (repeat/no-repeat/repeat-x/ repeat-y)

background-attachment: si la imagen de fondo se mueve al hacer scroll (scroll/fixed)

background-position: ((x y)/top/center/botton/left/right ) LISTAS: list-style-type: (imagen bullet disc/circle/square/decimal/ lower-roman/upper-roman/lower-alpha/upper-alpha/none) list-style-image: URL imagen usada como bullet list-style-position: si tiene sangra francesa (outside/inside)