Documento sin título

LONGITUDES

Hay propiedades en las que necesitaremos especificar alguna longitud (por ejemplo, en los márgenes). Para ello, usaremos esta notación:
[-]NNtipo
- - es el signo, y es opcional (es lo que quieren decir los corchetes, que se trata de algo opcional, los corchetes no hay que ponerlos).
- NN es la cantidad
- tipo es la magnitud.
  - Esta última puede ser relativa o absoluta
    - Actualmente no hay diferencias, aunque si debiera, es decir, si damos una medida en milimetros la representación en pantalla no deberia variar con la resolución, cosa que si debiera pasar con medidas en pixels. Prueba unidades
    - Las magnitudes relativas son:
      - em (el alto de la M mayúscula)
      - ex (la mitad de la altura de la M mayúscula, que viene a ser aproximadamente la altura de la x minúscula)
      - px (píxel).
    - Las magnitudes absolutas (medidas de distancia internacional) son
      - pt (puntos)
      - pc(picas)
      - in (inches, es decir, pulgadas)
      - mm (milímetros)
      - cm (centímetros).
  - Tambien puede ser porcentual , y se referirá a la mágnitud que tenia el elemento contenedor o padre Prueba unidades
Hay otras propiedades en las que tendremos que especificar un color; para ello hay tres posibilidades: escribiéndolo de la misma forma que en HTML, con la notación #RRGGBB, siendo RR, GG, BB los valores en hexadecimal de las componentes roja, verde y azul del color, usando algún nombre predefinido, o usando la función rgb(R,G,B), donde R, G, B son los valores en decimal de las componentes roja, verde y azul del color.

Propiedades de formato de bloque

Nombre	margin-left, margin-right, margin-top, margin-bottom, margin	padding-left, padding-right, padding-top, padding-bottom, padding	border-left-width, border-right-width, border-top-width, border-bottom-width, border-width	border-style
Valores posibles	longitud, porcentaje, auto	longitud, porcentaje	longitud	none, solid, double, inset, outset, groove, ridge
Valor por defecto	0	0	0	none
Aplica a	todos	todos	todos	todos
Heredado	No	No	No	No
Valor porcentual	Relativo al ancho del padre	Relativo al ancho del padre	-	-

Nombre	border-color	width	float	clear
Valores posibles	none, color	longitud, porcentaje, auto	left, right, none	none, left, right, both
Valor por defecto	none	auto	none	none
Aplica a	todos	elementos a nivel de bloque	todos	todos
Heredado	No	No	No	No
Valor porcentual	-	Relativo al ancho del padre	-	-

Aclaraciones sobre algunos valores:
Longitud: Debe ser un número seguido de una unidad de medida, tal y como se comentaba unos párrafos más arriba. Por ejemplo, un valor posible es 12pt, ó 0.2in.
Porcentaje: Fija el tamaño en valor porcentual respecto al padre.

Propiedades de las fuentes

Nombre	font-size	font-family	font-weight	font-style
Valores posibles	absoluto, relativo, porcentaje, longitud	familia	normal, bold, bolder, lighter, 100-900	normal, italic, oblique
Valor por defecto	medium	user preferences	normal	normal
Aplica a	todos	todos	todos	todos
Heredado	Sí	Sí	Sí	Sí
Valor porcentual	Relativo al padre	-	-	-

Aclaraciones sobre algunos valores:
- En font-size hemos dicho que puede tomar un valor absoluto; los posibles valores absolutos son: xx-large, x-large, large, medium, small, x-small, xx-small. Prueba unidades
- En font-family hemos dicho que el valor será family; esto hace referencia a una lista de nombres de familias de fuentes, separadas por comas. El navegador buscará por orden cada una de las fuentes especificadas, y usará la primera que encuentre instalada en el sistema. Por ejemplo, podemos poner font-family:Verdana,Arial; esto significará que el navegador buscará la fuente Verdana, y si no está instalada en el ordenador de quien ve la página, buscará la fuente Arial, por ser la siguiente en la lista. Así continuaríamos si hubiera más fuentes en la lista. Si no encuentra ninguna, usará la fuente por defecto. Es importante saber que existen unas familias de fuentes genéricas que están en todos los ordenadores, a fin de ponerlas como última alternativa en la lista. Estas familias son: serif, sans-serif, monospace, cursive, fantasy.
- En font-weight teníamos las posibilidades bolder, lighter y 100-900. Las dos primeras son relativas al valor actual. 100-900 quiere decir decir que podemos especificar un valor numérico entre 100 y 900. 100 será el más ligero y 900 el más pesado.

Propiedades de texto

Nombre	line-height	text-decoration	text-transform	text-align	text-indent
Valores posibles	número, longitud, porcentaje, normal	none, underline, line-through, blink	capitalize, uppercase, lowercase	left, right, center, justify, none	longitud, porcentaje
Valor por defecto	normal	none	none	left	0
Aplica a	elementos a nivel de bloque	todos	todos	elementos a nivel de bloque	elementos a nivel de bloque
Heredado	Sí	No	Sí	Sí	Sí
Valor porcentual	Relativo al tamaño de la fuente	-	-	-	Relativo al ancho del elemento padre

Propiedades de color y fondo

Nombre	color	background-color	background-image
Valores posibles	color	color	URL entre paréntesis
Valor por defecto	black	ninguno	ninguno
Aplica a	todos	todos	todos
Heredado	Sí	No	No
Valor porcentual	-	-	-

Propiedades de clasificación (listas)

Nombre	display	list-style-type	white-space
Valores posibles	block, inline, list-item, none	disc, circle, square, decimal, upper-roman, lower-roman, upper-alpha, lower-alpha	normal, pre, none
Valor por defecto	según HTML	disc	según HTML
Aplica a	todos	elementos cuya propiedad display es list-item	elementos a nivel de bloque
Heredado	No	Sí	Sí
Valor porcentual	-	-	-

Aclaraciones sobre algunos valores:
En display se indica si un elemento es de nivel de bloque (block), incrustado (inline) o de nivel de lista (list-item). Si se ajusta el valor a none, el elemento no será mostrado, lo que se extiende a sus "hijos" y la caja que lo rodea. Los elementos de bloque no responden si se les ajusta como inline.
Son muchas las posibilidades que tenemos para variar propiedades, pero al final terminaremos aprendiéndonos las seis o siete que más usemos. Es un interesante ejercicio practicar aplicando los posibles estilos en trozos del documento para ir adquiriendo más práctica. Aprendida la técnica de las hojas de estilo, en el siguiente bloque de capítulos nos centraremos en los layers.