MiWebCSS, galería de páginas web en español en CSS

MiWebCSS, galería de páginas web en español en CSS

MiWebCSS nace con la ilusión de ser la galería de referencia para páginas web en español en CSS. Existen infinidad de galerías CSS, todas ellas en inglés, si bien la comunidad hispana no dispone de un “escaparate” donde servirse de inspiración y promocionar trabajos de calidad en castellano.

Los usuarios pueden enviar sus trabajos para que sean incorporados en las galerías de MiWebCSS . Para que éstos sean aceptados deben cumplir dos requisitos fundamentales, a saber, cumplir estándares web actuales  (W3C) y ser trabajos en español y/o realizados por empresas hispanas.

Los criterios de selección de este índice se basan en la calidad, la innovación y la eficacia del diseño, ofreciendo una pasada rápida por los estándares del diseño web en español.

Más info | www.miwebcss.com

Sin Comentarios

CSS Page-Break, Orphans & Widows, versión XHTML friendly para impresión

Una de las partes del proyecto en el que ando liado actualmente requiere crear documentos dinámicamente a partir de una BBDD, pintarlos en HTML y exportarlos a PDF o Word.

El principal problema con el que nos encontramos a la hora de desarrollar la idea es cómo hacer que el contenido no quede cortado entre página y página. Una fórmula es crear una plantilla con varios contenedores con un tamaño determinado, de forma que cada contenedor quepa sin problemas en un A4 (o el tamaño del documento deseado) y la información no quede fraccionada.

Otro método mucho más sencillo y limpio de usar es con CSS. Existen varias clases que nos permiten establecer cuándo debe producirse un salto de página y cómo deben tratarse los párrafos para evitar que queden huérfanos o viudos.

CSS Page-break-[after, before, inside]

Al asignar una de estas clases a cualquier elemento de una página forzará el salto de página. Por ejemplo, si no queremos que ninguna tabla quede cortada, podemos definir que para todas las tablas del documento se produzca un salto de página antes de pintarlas (table { page-break-before:always } ).  Pueden tener varios valores:  auto (sólo si es necesario), always, avoid, left y right.

  • Page-break-after: después de un elemento se fuerza el salto de página.
  • Page-break-before: antes de un elemento se fuerza el salto de página.
  • Page-break-inside: dentro de un elemento se fuerza el salto de página. La W3C recomienda no abusar de esta clase y evitar utilizarla dentro de contenedores como tablas o divs.

CSS Orphans & Widows

Los términos Orphans (huérfano) y Widows (viudo) se utilizan cuando un párrafo se ha cortado al producirse un salto de página, cambio de columna o se ha insertado una imagen de por medio y el texto del párrafo ha quedado fraccionado en dos partes, quedando una de ellas con una sóla línea. Normalmente lo ideal es que si nos vemos forzados a cortar un párrafo por la mitad es dejar al menos dos líneas como mínimo en cada sitio.

  • Orphans: permite espeficar el número de líneas que debe mantener un párrafo al final de la página.
  • Widows: permite espeficiar el número de líneas en la parte superior de la página.

Más información

Page-break-before
Page-break-before
Page-break-inside
Orphans
Widows

Sin Comentarios

The Art & Science of CSS — Completo libro de CSS gratis

Sólo queda una semana para que expire la promoción de descargar de forma totalmente gratuita un completo libro de CSS: The Art & Science of CSS, valorado en 25,95$. El libro consta de 227 páginas a todo color distribuidas en varios capítulos (el e-book está en inglés):

  • Headings: cómo deben mostrarse los elementos de una web para ofrecer una idea clara de cómo está organizada la información.
  • The Art & Science of CSS — Completo libro de CSS gratisImágenes
  • Fondos
  • Navegación
  • Formularios
  • Redondear esquinas

Puedes descargar el e-book de dos formas distintas: bien vía mail o bien vía twitter (aunque yo no he encontrado el link directo para descargar el libro).

Más info | http://twitaway.aws.sitepoint.com

Sin Comentarios