Sin título

CSS

Es

Un lenguaje utilizado en la presentacion de documentos HTML, podemos decir que el lenguaje CSS sirve para organizar la presentación y aspecto de una página web.

Se basa

En intentar separar lo que es la estructura del documento HTML de su presentación.

Algunas opciones

Poder cambiar el color de algunas típicas etiquetas HTML como <H1> (h1 es una etiqueta en el lenguaje HTML destinada a mostrar un texto como encabezado, en tamaño grande).

Hay

Funciones algo más complejas, como introducir espaciado entre elementos <DIV> o como establecer imagenes de fondo

Es

Sencillo de aprender ya que para su definición siempre se hace uso de un identificador de etiqueta HTML, y después indicamos con qué aspecto queremos que se vean todas las etiquetas <H1> que salgan en un documento.

Ejemplo

Parte

Desde una pagina en la que solo tendremos un parrafo cuya etiqueta <p> sufrira cambios una vez creado solo se abre en el navegador en que habra un texto de color negro

PASO 1

Ver la utilidad del CSS tendremos crear nuestro archivo de hojas de estilo CSS que llamaremos estilos.css, que crearemos en el mismo directorio donde tengamos el archivo ejemplo.html y que contendrá lo siguiente:

/* Comentario en nuestro primer archivo css estilos.css – www.aprenderaprogramar.com*/

p {color:red;}

PASO 2

Despues de cambiar las propiedades del comentario CSS entre ellos el color rojo, tendremos nuestro archivo de estilos, estilos.css, debemos de importarlo para su uso a nuestra página web o documento html, ejemplo.html.

Para esto, las etiquetas: <head> y </head> de nuestro ejemplo.html.

Usaremos

Quedando asi:

<link rel="stylesheet" type="text/css" href="/estilos.css">

FINAL

Despues de tener el codigo que indica definicion de estilos, lo guardamos y abrimos el navegador web obteniendo el texto en rojo.

Podemos

Ver la facilidad de CSS para cambiar la presentación ya que si ahora quisiéramos cambiar el color, fuente, tamaño, etc, de la etiqueta <p>

Ambito de definicion para CSS

Existen 2 formas de aplocar los estilos

Definición en línea:

Definición hoja de estilos interna

Define

Las propiedades de la etiqueta HTML con el atributo style dentro del mismo archivo HTML y se le asigna una determinada cadena que definiría el comportamiento.

Ejemplo

<p style="color:red;">

Definen

Las propiedades de estilo de la misma forma que hacíamos en el archivo css independiente, pero en este caso se realiza en la misma página entre las etiquetas <head> y </head>.

Estandarizacion

Despues

De la aparición del lenguaje CSS nació la necesidad de estandarizar su uso para todos los navegadores y los desarrolladores de software, ya que habían muchas formas de escribir código CSS.

Éste

Seguirá evolucionando, pero hoy día puede decirse que ha sido un éxito al simplificar el mantenimiento de páginas web.