LaWebera.es
Estás en Home > Manuales web > Hojas de Estilo (CSS)

DHTML JavaScript Menu Courtesy of Milonic.com

 

Nota: Este documento es parte de una traducción al castellano de la Recomendación del W3C "Cascading Style Sheets, level 1" (más información). Puede consultar la versión original del mismo. Para cualquier comentario o corrección acerca de la traducción póngase en contacto con el traductor en jrpozo@conclase.net. Gracias por su colaboración.
Véase el Aviso de copyright de la traducción.

5 Propiedades CSS1

Las hojas de estilo influyen sobre la presentación de los documentos asignando valores a propiedades de estilo. Esta sección enumera las propiedades de estilo definidas y la lista correspondiente de sus posibles valores en CSS1.

5.1 Notación para los valores de las propiedades

En el texto que sigue, los valores permitidos para cada propiedad se enumeran con una sintaxis similar a la siguiente:

Valor: N | NW | NE
Valor: [ <longitud> | thick | thin ]{1,4}
Valor: [<nombre-de-familia> ,]* <nombre-de-familia>
Valor: <url> ? <color> [ / <color> ]?
Valor: <url> || <color>

Los valores entre "<" y ">" dan un tipo de valor. Los tipos más comunes son <longitud>, <porcentaje>, <url>, <número> y <color>; éstos se describen en la sección 6. Los tipos más especializados (p.ej., <familia-de-fuentes> y <estilo-de-borde>) se describen bajo la propiedad correspondiente.

Otras palabras son palabras clave que deben aparecer literalmente, sin comillas. La barra inclinada (/) y la coma (,) también deben aparecer literalmente.

Cuando aparezcan varias cosas yuxtapuestas, deben incluirse todas ellas en el orden especificado. Una barra (|) separa alternativas: debe especificarse una de ellas. Una barra doble (A || B) significa que debe especificarse A, B o ambas, en cualquier orden. Los corchetes ([]) se usan para agrupar. La yuxtaposición es más fuerte que la doble barra, y la doble barra es más fuerte que la barra. Así, "a b | c || d e" es equivalente a "[ a b ] | [ c || [ d e ]]".

Cada tipo, palabra clave, o grupo entre corchetes, puede ir seguido por uno de los siguientes modificadores:

5.2 Propiedades de fuente

El establecimiento de propiedades de fuente será uno de los usos más frecuente de las hojas de estilo. Desgraciadamente, no existe una taxonomía bien definida y universalmente aceptada para clasificar las fuentes, y algunos términos que se aplican a una familia tipográfica pueden no ser apropiados para otras. P.ej., para referirse a texto inclinado se utiliza normalmente el término 'italic', pero también pueden utilizarse otros términos como Oblique, Slanted, Incline, Cursive o Kursiv. Por tanto, no es un problema sencillo aplicar propiedades típicas de selección de fuentes a una fuente específica.

CSS1 define las propiedades 'font-family', 'font-style', 'font-variant' y 'font-weight', 'font-size', 'font'.

5.2.1 Emparejamiento de fuentes

Al no haber una taxonomía universal aceptada para las propiedades de las fuentes, el emparejamiento entre propiedades y fuentes tipográficas debe hacerse con cuidado. Las propiedades se emparejan en un orden bien definido para asegurarse de que los resultados de este proceso de emparejamiento sean tan consistentes entre AAUU como sea posible (suponiendo que se ponga a la disposición de todos ellos la misma biblioteca de fuentes tipográficas).

  1. El Agente de Usuario hace (o accede a) una base de datos de todas las propiedades relevantes con respecto a CSS1 de todas las fuentes de cuya existencia sabe el AU. El AU puede saber de la existencia de una fuente porque haya sido instalada localmente o porque haya sido previamente descargada de la web. Si hay dos fuentes que tengan exactamente las mismas propiedades, una de ellas se descarta.
  2. En un elemento dado, y para cada carácter de ese elemento, el AU integra todas las propiedades de fuente aplicables a ese elemento. A partir del conjunto completo de propiedades, el AU utiliza la propiedad 'font-family' para elegir una familia tipográfica tentativa. El resto de las propiedades se prueban con la familia de acuerdo con los criterios de emparejamiento descritos para cada propiedad. Si hay emparejamientos para todas las propiedades restantes, entonces ésa es la fuente emparejada con el elemento dado.
  3. Si no hay una fuente emparejada dentro de la familia tipográfica procesada en el paso 2, y si hay una familia tipográfica ('font-family') alternativa en el conjunto de fuentes, entonces se repite el paso 2 con la siguiente familia tipográfica alternativa.
  4. Si hay una fuente emparejada, pero no contiene un signo para el carácter considerado, y si hay una familia tipográfica alternativa en el conjunto de fuentes, entonces se repite el paso 2 con la siguiente familia tipográfica alternativa. Véase el apéndice C para una descripción de la codificación de fuentes y caracteres.
  5. Si no hay fuente dentro de la familia seleccionada en 2, entonces se usa la familia tipográfica por defecto del AU y se repite el paso 2, usando el mejor emparejamiento que pueda lograrse con la fuente por defecto.

(El algoritmo recién descrito puede optimizarse para evitar tener que comprobar las propiedades CSS1 con cada carácter.)

Las reglas de emparejamiento de cada propiedad mencionada en el paso (2) son las siguientes:

  1. Se comprueba 'font-style' en primer lugar. 'italic' se satisfará si hay o bien una fuente en la base de datos de fuentes del AU etiquetada con la palabra clave CSS 'italic' (preferentemente) o bien con 'oblique'. De otro modo los valores deben coincidir exactamente o font-style fallará.
  2. A continuación se comprueba 'font-variant'. 'normal' se empareja con una fuente que no esté etiquetada como 'small-caps' (versalitas). 'small-caps' se empareja (1) con una fuente etiquetada como 'small-caps', (2) con una fuente en la que las versalitas sean sintetizadas, o (3) por una fuente en la que todas las letras minúsculas estén reemplazadas por letras mayúsculas. Una fuente de versalitas puede ser sintetizada escalando electrónicamente las letras mayúsculas de una fuente normal.
  3. A continuación se comprueba 'font-weight'. No fallará nunca (ver 'font-weight' más abajo).
  4. 'font-size' debe emparejarse dentro de un margen de tolerancia dependiente del AU. Normalmente, los tamaños de las fuentes escalables se redondean al píxel más cercano, mientras que la tolerancia de fuentes de mapas de bits podría ser tan grande como del 20%. Los cálculos ulteriores, p.ej., usando 'em' en otras propiedades, se basarán en el valor del 'font-size' realmente utilizado, no en el que ha sido especificado.

5.2.2 'font-family'

Valor: [[<nombre-de-familia> | <familia-genérica>],]* [<nombre-de-familia> | <familia-genérica>]
Inicial: depende del AU
Se aplica a: todos los elementos
Se hereda:
Valores porcentuales: N/A

Esta propiedad es una lista de nombres de familias tipográficas y/o nombres de familias genéricas ordenadas por prioridad. A diferencia de la mayoría de las demás propiedades CSS1, los valores se separan por comas para indicar que son alternativos:

BODY { font-family: gill, helvetica, sans-serif }

Hay dos tipos de valores en la lista:

<nombre-de-familia>
El nombre de una familia tipográfica para elegir. En el último ejemplo, "gill" y "helvetica" son familias tipográficas.
<familia-genérica>
En el ejemplo anterior, el último valor es un nombre de familia genérica. Se definen las siguientes familias genéricas:
  • 'serif' (p.ej. Times)
  • 'sans-serif' (p.ej. Helvetica)
  • 'cursive' (p.ej. Zapf-Chancery)
  • 'fantasy' (p.ej. Western)
  • 'monospace' (p.ej. Courier)
Se recomienda a los diseñadores de hojas de estilo ofrecer una familia tipográfica genérica como última alternativa.

Los nombres de fuentes que contengan espacios en blanco deberían entrecomillarse:

BODY { font-family: "new century schoolbook", serif }
  
<BODY STYLE="font-family: 'My own font', fantasy">

Si se omiten las comillas, no se tienen en cuenta los caracteres de espacio que haya antes y después del nombre de la fuente, y cualquier secuencia de caracteres de espacio dentro del nombre de la fuente se convierte a un único espacio.