ColoresFormato textoPos. imágenesListasTablasPromocionalesBotonesLíneas

COLORES EN ESTE SITIO

Texto con clase «color1» Fondo con clase «fcolor1» y texto «blanco»
Texto con clase «color2» Fondo con clase «fcolor2» y texto «blanco»
Texto con clase «color3» Fondo con clase «fcolor3» y texto «blanco»
Texto con clase «azul» (fijo) Fondo con clase «gris-claro»
Texto con clase «naranja» (fijo) Fondo con clase «gris-oscuro» y texto «blanco»
Texto y fondo con clase «oro» Texto y fondo con clase «tutor»


CABECERAS HTML

(h2) Estilo de texto y color para etiqueta h2

(h3) Estilo de texto y color para etiqueta h3

(h5) Estilo de texto y color para etiqueta h5
(h6) Estilo de texto y color para etiqueta h6

 

ESTILOS DE TEXTO PARA CUERPO

Texto con clase «negrita»
Texto con clase «fuente»
Texto con clase «nota»
Texto con clase «may negrita»
Texto con clase «destacado1»
Texto con clase «destacado2»
Texto con clase «centro»
Texto con clases «centro y centrov»
Texto con clase «sangrado1»
Texto con clase «sangrado2»
Texto con clase «sangrado3»
Texto con clase «video»
Texto con clase «podcast»
Clase «xl»
Clase «xxl»

 


POSICIONAMIENTO DE IMÁGENES

Imagen con clase «img-izquierda»
Imagen con clase «img-derecha»

 


LISTAS NO ORDENADAS

Lista «checks»

  • Opción de lista 1
  • Opción de lista 2
  • Opción de lista 3
Lista «plazas»

  • Opción de lista 1
  • Opción de lista 2
  • Opción de lista 3
Lista «fechas»

  • Opción de lista 1
  • Opción de lista 2
  • Opción de lista 3
Lista «libros»

  • Opción de lista 1
  • Opción de lista 2
  • Opción de lista 3
Lista «bolos»

  • Opción de lista 1
  • Opción de lista 2
  • Opción de lista 3
Lista «pines»

  • Opción de lista 1
  • Opción de lista 2
  • Opción de lista 3
Lista «envios»

  • Opción de lista 1
  • Opción de lista 2
  • Opción de lista 3
Lista «cursos»

  • Opción de lista 1
  • Opción de lista 2
  • Opción de lista 3

LISTAS ORDENADAS

  1. Opción de lista 1
  2. Opción de lista 2
  3. Opción de lista 3
  4. Opción de lista 4
Lista numerada (no anidar)
Lista «ol» con clase «numeros» + Elemento lista (li) con clase «num»
Número máximo de elementos 9


TABLAS

Tabla clase «tabla-borde»

Contenido celda
Contenido celda
Contenido celda
Contenido celda
Contenido celda
Contenido celda

Tabla clase «tabla-sin-borde»

Contenido celda Contenido celda
Contenido celda Contenido celda
Contenido celda Contenido celda
Contenido celda Contenido celda
Contenido celda Contenido celda
Contenido celda Contenido celda

Tabla clase «par»

Contenido celda
Contenido celda
Contenido celda
Contenido celda
Contenido celda
Contenido celda

Tabla clase «impar»

Contenido celda
Contenido celda
Contenido celda
Contenido celda
Contenido celda
Contenido celda

Celda con clase «cabecera»

Celda con clase «cabecera»

Celda con clase «total»

Celda con clase «total»

Tabla preformateada clase «tabla-plazas»

Categoria Plazas
Categoría 1 250
Categoría 2 366
Categoría 3 120
Total 736

 

Tabla preformateada clase «tabla-cursos»

Curso Oro Curso con Tutor
Test de muestra para autoevaluación inicial
Etiqueta i con clase «on» Etiqueta i con clase «off»


ELEMENTOS PROMOCIONALES

Desde
289

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam molestie consequat porta. In sodales arcu tortor, nec laoreet lacus aliquam et. Etiam pretium condimentum velit nec porta. Aliquam erat volutpat. Vestibulum tristique interdum augue, non dapibus velit euismod vitae. Praesent sit amet sem a metus viverra aliquam. Etiam sollicitudin, dui ut mattis ultricies, turpis velit gravida lorem, et condimentum augue ex eu eros

Div con clase «circulo», span con clase «desde», span con clase «precio» y span con clase «euro»

Texto con clase «promo»Promoción
Texto con clase «pack-ahorro»Pack ahorro disponible
Caja con clase «caja»
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam molestie consequat porta. In sodales arcu tortor, nec laoreet lacus aliquam et. Etiam pretium condimentum velit nec porta. Aliquam erat volutpat. Vestibulum tristique interdum augue, non dapibus velit euismod vitae. Praesent sit amet sem a metus viverra aliquam. Etiam sollicitudin, dui ut mattis ultricies, turpis velit gravida lorem, et condimentum augue ex eu eros


BOTONES

Botón clase «boton»

Boton 1

Botón clase «boton-min»

Boton 2


LÍNEAS

Línea html con «hr»


Guía de estilos