[Recomendación] W3School

Hola!
Hoy abro la sección de recomendaciones de sitios que me resultan utiles a la hora de programar.
Para empezar, hoy hablaré de W3School, un sitio we para desarrolladores que incluye todas las tecnologias web disponibles hoy en el mercado. Aparte de completos tutoriales, tiene una funcionalidad bastante util a mi parecer, denominada "Try it Youself". En cada ejemplo del sitio tiene un botón con dicho text, que, al pulsar, te lleva a una página dividida, en una mitad el código precargado del ejmplo en si, y en la otra mitad, el resultado final de dicho código. Lo bueno es que puedes editar ese código y var casi al instante como quedaría en el navegador real que estes usando.

Try it Yourself

Recomendaciones by Peter

[CSS3] Fuentes tipográficas: Google Fonts

Como ya dije en su día, hoy toca hablar un poco más detenidamente de las fuentes de Google.
Como todo en el mundo web, la utilización de recursos ajenos a nuestros servidores trae consigo una serie de ventajas e inconvenientes, que nunca esta de más recordarlos.
Para empezar con lo positivo, lo bueno de tener cierto recursos fuera de nuestro servidor implica una menor carga del mismo a la hora de mostrar un determinado resultado, con su correspondiente reducción de ancho de banda por nuestra parte, al estar repartida.
Y aqui es donde viene el pero, ya que al no ser nosotros los administradores de dicho contenido, podremos estar haciendo referencia a algo que con el tiempo cambie, y tendremos un enlace caido, o aún peor, un enlace a algo que nunca hubiesemos deseado que estuviese en nuestras página.
A lo que veniamos: aqui les dejo un enlace a las fuentes de Google, junto con un pequeño tutorial de como generar el código, tanto CSS como HTML:

[CSS3] Fuentes tipográficas

Tipografías web en CSS3 - la regla @font-face
Las tipografías web permiten a los diseñadores usar fuentes que no se encuentren en el ordenador del cliente.
Cuando tienes en tu propia tipografía (o te la descargar, como escribiré en otro post, de sitios como Google Font) y la quieres usar, simplemente incluyela en tu servidor web (o haz crea una referencia en el código en el caso de que se encuentre en otro servido) y será descargada automaticamente cuando en el cliente se necesite.
Las tipografias personalizadas se definen con la regla CSS3 @font-face.

Diferentes formatos de fuente
Fuentes TrueType (TTF)
TrueType es un formato de fuente estándar desarrollado a finales de 1980, por Apple y Microsoft. TrueType es el formato de la fuente más común para los sistemas operativos Mac OS y Microsoft Windows.
Fuentes OpenType (OTF)
OpenType es un formato de fuente escalable. Fue desarrollado bajo TrueType, y es una marca comercial registrada de Microsoft. Las fuentes OpenType son comúnmente utilizadas hoy por las principales plataformas informáticas.
El formato de fuente tipográfica abierto web (The Web Open Font Format)(WOFF)
WOFF es un formato de fuente diseñado para usarse en páginas web. Fue desarrollado en 2009, y actualmente es el formato recomendado del W3C. WOFF es esencialmente una tipografía OpenType o TrueType comprimida y metadatos adicionales. El objetivo es fomentar la distribución de las fuentes desde el servidor al cliente, aun teniendo limitado el ancho de banda.
El formato de fuente tipográfica abierto web The Web Open Font Format(WOFF 2.0)
Mejora la compresión de las fuentes TrueType/OpenType con respecto a WOFF 1.0.
Fuentes OpenType incrustadas (Embedded OpenType Fonts)(EOT)
Las fuentes tipográficas EOT son una forma compactada de las fuentes OpenType, diseñado por Microsoft para usarse como fuentes incrustadas en las páginas web.

Un ejemplo rápido:

CSS:

@font-face {
    font-family: myFirstFont;
    src: url(sansation_light.woff);
}

div {
    font-family: myFirstFont;
}



Fuente del articulo: W3S

[CSS2] Propiedad Overflow.

La propiedad overflow define que es lo que debe de pasar si el contenido sobrepasa las dimensiones de su caja.
Esta propiedad puede tomar los siguientes valores:
  visible: el contenido que desborda a la caja no se oculta. El contenido se sale de la caja del elemento. Esta es la opción predeterminada.

 hidden: el contenido que desborda a la caja se oculta, no siendo visible.

scroll: el contenido que desborda a la caja se oculta, pero se añade una barra de desplazamiento para ver el resto del contenido.

auto: si el contenido sobrepasa a la caja contenedora, el contenido que desborda a la caja se oculta y se agrega una barra de desplazamiento para ver el resto del contenido (comportamiento similar a scroll). Si no desborda, se mostrará todo el contenido si la barra de desplaiento.