Manual de CSS

Introducción

Sobre ésta página

Ültima modificación: 22-08-2017.

Visitas este mes: 393

Visitas el mes pasado: 1268

Qué es CSS

Bienvenid@s al manual de CSS. En este manual aprenderemos el lenguaje utilizado para

aplicar el estilo a las págnas web: el Cascading Style Sheets (Hojas de estilo en cascada), o
también CSS.

Las páginas Web están escritas o programadas en un lenguaje informatico llamdo HTML.
El HTML es el lenguaje del navegador. Éste lee e intrepreta este código para que la página
Web pueda verse correctamente.

Sin embargo el HTML tiene limitaciones para poder dar forma a un documento. Es decir,
tiene dificultades para, por ejemplo, maquetar las páginas, dar forma a las secciones, poner
distintos fondos, tipos de letra, etc. Todo esto lo soluciona el lenguaje CSS, el cual le da
estilo a la página, y controla la forma visual y el lugar exacto en el que se presentarán las
distintas secciones, imagenes, etc.

Por tanto para seguir el "Manual de CSS" es conveniente tener algunas nociones de HTML.
lo recomendable es seguir ambos manuales a la vez, ya que CSS complementa y define la
forma en que se verán los distintos elementos en la página que son introducidos por el
HTML.
En principio las páginas se escribían sólo con HTML, sin embargo ciertos aspectos del
estilo de la página, (colores, tamaños, posición de elementos) se hacia complicado
escribirlos en HTML, por lo que pronto aparece el CSS para separar lo que es el contenido
en sí (escrito en HTML) del estilo (escrito en CSS). Por lo tanto HTML y CSS son
complementarios, y ambos son necesarios para escribir una página web.

Lenguajes informáticos

HTML y CSS son lenguajes informáticos. Un lenguaje informatico es aquel que nos sirve
para transmitir una información a un ordenador para que éste haga algo. HTML y CSS son
lenguajes informáticos simples, es decir, lo que nosotros le transmitimos al ordenador, es lo
que éste hace directamente.

Existen también los lenguajes informáticos más complejos o de programación, algunos de

ellos relacionados con la creación de páginas web, pero éstos los veremos en otros
manuales.

Al decir que son "lenguajes informáticos simples" significa que en HTML y CSS no
utilizamos operaciones aritméticas, bucles de repetición ni nada que pueda tener un
lenguaje de programación. Es simplemente eso, un lenguaje, con una serie de palabras y
signos, y una sintaxis (la forma de ordenar las palabras y signos).

Ventajas de CSS

Aunque en principio puede parecer que utilizar CSS complica la creación de páginas por
tener que usar dos códigos diferentes, esto no es así, ya que al usar CSS, el código HTML
queda bastante reducido, pues no hay que indicar en él lo que hayamos puesto en CSS.
Además los dós códigos pueden escribirse en distintas partes de la página, incluso podemos
escribir el código CSS en un archivo aparte, con lo que se separa perfectamente lo que es el
texto, imagen, o documento (En HTML) de su forma de presentación (En CSS).

Por ejemplo, en un párrafo de texto, el lenguaje HTML indicará solamente que ese texto es
un párrafo, y el lenguaje CSS le indicará el tipo de letra, su tamaño, su color, etc. Con esto
conseguimos tener el código HTML libre de indicarle cómo va a ser la apariencia o estilo
de la página. Esto también es más cómodo a la hora de buscar errores o querer cambiar la
apariencia de la página.

Por otra parte CSS tiene la ventaja de poder aplicar el mismo estilo a distintos apartados de
la página, e incluso, si escribimos el código CSS en un archivo externo, podemos usar el
mismo código para varias páginas. Podemos aplicar el mismo estilo a diferentes elementos,
incluso de diferentes páginas, indicándolo sólo una vez, sin tener que escribir o repetir el
código para cada elemento,, como ocurriría si se escribiera en HTML.

Por ejemplo, mediante una sóla instrucción podemos cambiar el color de todos los enlaces
de la cabecera, o el color del fondo de todas las páginas de una Web
Herramientas

Para seguir el manual y poder seguir los ejemplos que proponemos, necesitaremos las
mismas herramientas que usamos para el manual de HTML.

Navegadores

El navegador es el programa donde visualizamos las páginas web. por ejemplo Internet
Explorer, Google Chrome u otro similar.

Como es obvio, necesitamos al menos un navegador para ver los resultados de nuestro
trabajo, aunque en realidad es conveniente tener instalados varios navegadores. No todos
los navegadores funcionan de la misma manera ni muestran las páginas igual. Puede haber
pequeñas (o grandes) diferencias entre uno y otro. Debemos constrastar los resultados en
varios de ellos, necesitamos evidentemente tener instalados los navegadores más usados por
los internautas y que abarquen prácticamente la totalidad de cuota de mercado, para
asegurarnos que nuestra página la verán igual (o de forma muy parecida) la gran mayoría
de los internautas.

Consideramos imprescindible tener instalado el navegador Mozilla-Firefox, ya que en éste

encontramos varios complementos que utilizaremos para trabajar con nuestras páginas.

Puedes ver cuáles son los principales navegadores, y los enlaces para descargártelos en
nuestra sección sección Complementos / Navegadores

Editor de textos

HTML y CSS son lenguajes, y por tanto debemos escribirlos en algún sitio. Este sitio debe
ser un editor de textos plano, pàra después guardarlos en archivos.

Es por ello que para programar en CSS necesitamos un editor de texto plano. Esto es, un
programa en el que guardar el texto sin más añadidos. En principio puede servirnos el
block de notas de Windows. Lo encontrarás (suponiendo que tienes Windows) en inicio /
programas / accesorios.

Sin embargo aquí utilizaremos el editor HTML-Kit. En la sección complementos /

programas / HTML-Kit explicamos dónde conseguirlo y cómo descargarlo. Este es uno de
los mejores editores de texto gratuitos para crear páginas web. Te recomendamos que lo
tengas instalado en tu ordenador para poder seguir este manual, ya que te facilitará mucho
el trabajo.
Además debemos tener conocimientos de HTML, ya que es el lenguaje principal en el que
se construye la página, y al cual se refieren las instrucciones que damos en el lenguaje CSS.

Al ser CSS un complemento de HTML, debemos saber previamente el lenguaje HTML. De

no ser así se recomienda empezar con el manual de HTML, y continuar con la opción de
seguir los dos manuales a la vez.

El manual

Tal como hemos dicho antes tenemos la opción de seguir sólo el manual de CSS o seguir el
manual de CSS junto con el de HTML. Esto es lo que debe hacerse si no conocemos el
lenguaje HTML. En este caso empezamos por el manual de HTML

Tanto en el manual de HTML como en el de CSS indicaremos cuando pasar de un manual

al otro para poder seguir los dos al mismo tiempo.