CSS en PAPYRE STREET

Desde PAPYRE STREET, Coco no viene a enseñarnos "Lejos" y "Cerca", sino a darnos una idea sencilla sobre CSS, ya que vamos a encontrarnos con ello al manejar nuestros libros electrónicos, como veremos en un futuro POST sobre como como configurar los ficheros CSS de COOLREADER.

CSS: Hoja de Estilos en Cascada (Cascading Style Sheet)
Es una hoja que controla los estilos de presentación del contenido del documento. Así de sencillo. ¿Por qué? Cuando se creó el HTML, los programadores se dieron cuenta que el tener mezclado el texto y los códigos de formato era muy complicado de mantener. La idea fue SEPARAR el contenido de la PRESENTACIÓN. Se aplica sobre documentos con contenidos estructurado, el HTML y el XML, que tienen en común que son lenguajes de ETIQUETAS.
- Pero, Coco, ¿Qué son etiquetas?
Son simplemente elementos encerrados entre “<” y “>” (delimitadores) y que marcar el comienzo de lo que etiquetan y el final. Así
<pepe>Esto es Pepe</pepe>La primera etiqueta señala donde empieza “Pepe” y la última, dónde termina; y por eso mismo lo que hay entre las dos etiquetas es precisamente "Pepe"; y no otra cosa.
Cómo trabaja con lenguajes de etiquetas, por consistencia, CSS también se diseñó como lenguaje de etiquetas.
- ¿Y que pinta tiene?
Pues tendrás 1 o más archivos de texto plano, con la extensión .CSS que empezará con una etiqueta …
- ¿“Formato”?
Parecido, “Style”. Entre una etiqueta de apertura <Style>; y una de cierre </Style> estará la definición de todos los formatos o estilos que vayan a aplicarse al documento que almacena el contenido que queremos formatear. Lógico ¿no? Y EN CASCADA, que significa que distintas definiciones o elementos pueden estar anidados unos dentro de otros como las muñecas rusas que van guardando una dentro de otra.  Así
<verde>Aquí empieza lo verde hasta que encontramos una etiqueta de color <rojo> rojo y todo será rojo y no verde <negro>y aquí, negro; no de otro color.</negro>Otro poco rojo.</rojo><azul>Y un trozo</azul>azul hasta que toca volver a ser verde por la etiqueta del principio.</verde>

ESTRUCTURA DE LOS ESTILOS
La información de formato (“ruleset”) que define un estilo puede estar escrita de dos formas:
- Entre corchetes
NombredelEstilo modificadoropcional {aquí dentro vienen los datos que dicen como es el estilo}
NombredelEstilo puede ser un nombre cualquiera (“Verso”) o el nombre de una clase de elemento (“h1” por Heading1, es decir la cabecera más grande que haya en el documento; “body”, por el cuerpo de documento). Y en ese caso, evidentemente es el estilo que se aplica a esa clase de componentes del documento (aunque no en exclusiva).

- AT (“arroba” en inglés)
@NombredelEstilo datos que dicen como es el estilo;  (empieza con la arroba y termina con el punto y coma)

Si el ruleset es un atributo aplicable al texto (“título”) se escribe con un “.” delante “.title” y en ese caso se le puede añadir delante una clase de elemento (“h1.title”) lo que supone como en el caso anterior que se aplica a esa clase de componentes del documento, que en este caso sería “encabezado de nivel superior que es usado como título”.

¡Y YA ESTÁ!
En realidad, estos son todos los conceptos que hay que entender, –un poco liosos, lo reconozco- pero el resto es el detalle de cómo se definen los estilos en concreto; y con esa información se entiende mucho mejor. APLICANDOSE.

CÓMO SE ESPECIFICA EL FORMATO DEL TEXTO
La mayoría de los atributos de especificación se aplican a párrafos o bloques de texto mayores, excepto algunos que pueden aplicarse a partes de una línea de texto. Y todos tienen la forma Atributo  Valor
text-indent  12   Indentar la primera línea del párrafo 12 puntos
text-indent  15%   Indentar la primera línea del párrafo un 15% de longitud de la línea
text-indent  inherit   Indentar la primera línea del párrafo de igual forma que se indentaba en elemento que contiene al que estamos, el elemento anterior.

Y recordad, niños, esto es CERCA y esto es LEJOS