Tecnologías de la Información y la Comunicación · 2º Bachillerato
Curso 2016/2017·  

Clases CSS para distintos propósitos

Cuando creamos un Website desde cero es necesario pensar antes el diseño que queremos realizar y los distintos efectos que vamos a implementar. Todo esto supone crear una/s hojas CSS genéricas y optimizadas que nos permitan trabajar en nuestro Website de manera más cómoda.

Aquí os propongo una serie de clases genéricas para distintos propósitos. Creando una hoja CSS ordenada y bien comentada nos resultará sumamente fácil cambiar radicalmente el aspecto de cualquier página de nuestro Sitio sin más que añadir clases a las distintas "cajas" (div) que coloquemos.

Antes de comenzar a escribir reglas CSS vamos a declarar algunas variables genéricas que nos serán útiles a lo largo de la hoja, de esta forma con cambiar el valor de éstas aquí cambiará su valor en cualquier lugar donde las estemos utilizando:


/* Variables generales //////////////////////////
================================================= */
:root {
  --anchoSite  : 1280px;
  --espacio    : 2%;
  --altoBanner : 15vw;
  
  --color1f  : hsla(0, 0%, 100%, 1);
  --color2f  : hsla(0, 0%, 0%, 0.4);
  --color3f  : hsla(30, 50%, 25%, 0.4);

  --color1t  : hsla(0, 0%, 20%, 1);
  --color2t  : hsla(0, 0%, 80%, 1);
  --color3t  : hsla(30, 50%, 25%, 1);
}

 

 

Etiquetas: CSS3

Imprimir

En línea...

Hay 13 invitados y ningún miembro en línea

Prácticas...

aulav

Visitas...

2.png1.png2.png3.png7.png
Hoy ........14
Ayer .......36
Mes ........608

Jueves, 18 Julio 2019