> Manuales > Manual de Blueprint CSS

Manual del framework CSS Blueprint, con explicaciones y ejemplos de la rejilla que permite maquetar páginas web de una manera sencilla y compatible con todos los navegadores.

Artículos
  • Artículos del manual

  • Introducción a Blueprint

    Capítulos que describen el framework CSS Blueprint y explican su modo de funcionamiento. Se detallará el uso de la rejilla, utilizada para el posicionamiento de los elementos y se presentará un primer ejemplo de uso sencillo.

  • 1 Blueprint, Framework CSS

    Presentación de Blueprint, un framework CSS que sirve de apoyo en el diseño y maquetación de webs 2.0, gracias a su rejilla y otros estilos de tipografía e impresión.

  • 2 Comenzar a usar Blueprint

    Primeros pasos con Blueprint: Identificar los contenidos del archivo para descarga y empezar a usar el framework CSS Blueprint.

  • 3 Entender la rejilla de Blueprint

    Cómo es la rejilla por columnas disponible en Blueprint y las primeras clases para comenzar a posicionar los elementos en ella.

  • 4 Primer ejemplo de página con Blueprint

    Podemos ya ver un primer ejemplo de página desarrollada con el framework CSS Blueprint.

  • Clases de Blueprint

    Realizar los primeros pasos con el framework CSS Blueprint no resulta difícil. Habremos podido comprobar que, teniendo con unos pocos conceptos claros y mediante un pequeño conjunto de clases, se pueden hacer cosas bastante interesantes, que nos ayudarán a maquetar webs de una manera muy sencilla. Sin embargo, para poder sacar todo el provecho al framework, necesitaremos dominar las clases que nos ofrece.

  • 5 Clases CSS principales del grid Blueprint

    Un listado de las clases del framework CSS Blueprint que sirven para definir el layout de nuestra página web, utilizando la rejilla.

  • 6 Ejemplo de uso de las clases del grid de Blueprint

    Un layout creado a través del framework CSS Blueprint, con ejemplos de uso de las clases más importantes del grid de Blueprint.

  • 7 Recomendaciones a la hora de diseñar con el framework CSS Blueprint

    Algunas recomendaciones para que el trabajo con Blueprint sea más sencillo y podamos sacarle mayor provecho al framework CSS.

  • Ejemplos de maquetación CSS realizada con Blueprint

    Aparte de los ejemplos vistos hasta el momento sobre la maquetación CSS con Blueprint, realizamos varios talleres para aprender a manejar mejor el framework CSS.

  • 8 Taller Blueprint: layout con cabecera y pie fluidos

    Un ejemplo de diseño utilizando el framework CSS Blueprint en el que realizamos la cabecera y pie de página fluidos, que se ajustan a la anchura disponible.

  • 9 Vídeo del diseño web con Photoshop y la plantilla de Blueprint

    Vídeo tutorial del diseño con Photoshop de una web básica, utilizando una rejilla de 24 columnas obtenida del framework Blueprint CSS.

  • 10 Vídeo: Maquetación de un diseño con Blueprint CSS. Parte 1 de 3

    Vídeo de la maquetación CSS ayudados por el framework CSS Blueprint. Partimos de un diseño con Photoshop y generamos la plantilla en HTML y CSS.

  • 11 Vídeotutorial sobre la maquetación con Blueprint CSS. Parte 2 de 3

    Segunda parte del videotutorial de diseño web y maquetación con el framework CSS Blueprint.

  • 12 Maquetación de una web con Blueprint CSS. Vídeo final parte 3 de 3

    Último vídeo de la práctica de maquetación web con CSS ayudados por el framework CSS Blueprint.

  • 13 Estilos CSS para formularios en el framework Blueprint

    En el archivo forms.css de Blueprint encontraremos definiciones de estilos CSS para ayudarnos a estilizar formularios en HTML.