Cabecera fija con CSS

CSS, Diseño , 2 Comments

Para crear una cabecera que se mantenga fija mientras hacemos scroll solo necesitamos un poco de CSS:

<style type="text/css">
  body{
  margin:0;
  padding:100px 0 0 0;
}
div#header{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100px;
  background-color:#333;
  color:#FFFFFF;
}
 @media screen{
  body>div#header{
   position: fixed;
  }
 }
 * html body{
  overflow:hidden;
 } 
 * html div#content{
  height:100%;
  overflow:auto;
 }
</style>

Siendo estos los DIV’s que contendrán tanto la cabecera como el contenido de la página:

<div id="header"> cabecera </div>
<div id="content"> contenido </div>

Via: Anne’s Blog

10 increibles fuentes “hechas a mano”

Diseño, Recursos , 0 Comment

handwritten

Estaba buscando fuentes para un proyecto cuando me encontre con esta recopilacion de 10 fuentes hechas a mano (handwritten fonts) en myInkBlog. Todas estas fuentes son gratuitas, pero lo que no sabria deciros es si tienen alguna restriccion para su uso comercial. Este tipo de fuentes estan siendo muy utilizadas en los diseños web, pero pueden ser utiles para cualquier cosa que se tenga en mente. Ademas, en esta pagina estan haciendo una serie de recopilaciones de fuentes a las que les puedes hechar un vistazo por si te son utiles.

Via| myInkBlog

Qtpfsgui: crea imagenes HDR facilmente

Diseño, Recursos , 0 Comment

Estaba buscando informacion sobre las imagenes HDR (High Dinamic Range) y me encontre en xcitingart leyendo un post en el que hablan de un programa Open Source para crear este tipo de imagenes facilmente.

Qtpfsgui: anda que el nombre ...

Qtpfsgui: anda que el nombre ...

Esta tecnica consiste en tener tres imagenes con diferentes exposiciones (normal, subexpuesta y sobreexpuesta) para dar como resultado una imagen con una gran nitidez, tanto en las zonas ilumindadas como en las zonas oscuras.

Seguire investigando esta tecnica (que me resulta muy llamativa) para contaros mas sobre ella y haceros un tutorial.

Via| xcitingart

Programa| Qtpfsgui

+| Ejemplos

1 2