Lenguaje de Programación Css

Cascading Style Sheets o en español Hojas de Estilo en Cascada, mayormente conocido como Css es un lenguaje de programación de estilos utilizados para dar presentación de documentos tales como Html, Xml (en -US). Css describe como debe ser renderizado cada elemento estructurado.

Css es uno de los lenguajes vitales dentro de la programación web, así como dentro del paquete de Office tenemos herramientas que nos ayudan a darle una mejor presentación a nuestros documentos, tanto como en Word, Excel, PowertPoint entre otros. Css es nuestra herramienta para darle presentación a cada elemento que estructuramos en un lenguaje de Marcación de Texto, como Html.

Css ha pasado por algunas actualizaciones, actualmente manejamos lo que es Css3 que nos ha abierto la web a una interaccion más social y mucho más amigable con el usuario, algunas de estas actualizaciones son:

Bordes redondeados, textos con sombras, la capacidad de asignar múltiples fondos, un mejor manejo de tablas incluyendo el estilo zebra, multi-columnas, entre otros.

 


¡¡Aprendamos Css!!

 

Lo primero que vamos a hacer es dirijirnos a nuestro editor de Codigo Preferido y crear un archivo llamado "Style" y le agregaremos la extencion ".css" nos deberia quedar algo como "Style.css"

 


Excelente, ya tenemos nuestra hoja de estilos en Css, ahora vamos a crear una oja para agregar el contenido que estructuraremos, esto lo haremos creando un documento en html, lo llamaremos de la siguiente manera "Index" y le agregaremos la extención ".html" deberia quedarnos algo asi "Index.html"

 


¿Como vinculamos un archivo Html y Css?

 Dentro de la etiqueta <head> </head> de nuestro documento Index.html agregaremos una etiqueta de tipo "Link" que contendra las siguientes especificaciones: 

 <link rel="stylesheet" href="../Css/Style.css">




¿Que es un Selector? 

Un selector dentro de Css3 como su nombre lo indica, es una forma de identificar la etiqueta o grupos de etiquetas a las cuales vamos a renderizar y darles una mejor presentación.

Dentro de Css tenemos varios tipos de Selectores, algunos de ellos son:

  • Selector Universal
  • Selector de Etiqueta
  • Selector de Id
  • Selector de Clase
  • Selector de Atributo
  • Selectores Hijo


Selector Universal:

Como su nombre lo indica este selector se aplicara a todo nuestro diseño, para crear la etiqueta usamos la siguiente construcción dentro de nuestra hoja "Style.css"

Nuestro selector  universal se identifica con  "*" antes de comenzar a darle la estructura que el selector va a aplicar dentro de nuestro proyecto:

 

Dentro de nuestra etiqueta universal agregamos la propiedad "Font-family" esta propiedad busca una serie de fuentes de texto dentro de nuestro computador o archivo de trabajo en caso de que descargaremos alguna.

Declaramos que  "*"  todo el texto tendrá la propiedad "{Font-Family: Cursive;}" Cursiva 

* {

font-family:cursive;

}

 

 



     

No hay comentarios:

Publicar un comentario