Este truco consiste en opacar una foto y agregarle texto, en un recuadro, encima.
Te regalo una flor
background:url(http://img54.imageshack.us/img54/4210/815bb578fa4e7384uu3.jpg);">
</div>
<div style="width:200px;border:2px solid maroon;padding:12px;font-weight:bold;position:relative;top:-150px;left:0px;color:white;
background:url(http://img54.imageshack.us/img54/4210/815bb578fa4e7384uu3.jpg);"> Te regalo una flor
</div></center>
Configurar:
Primero vemos la medida de la imagen
width:267px;height:400px
Para opacar tocamos en esta medida
filter:alpha(opacity=50);opacity:.50;
Por último la foto de fondo
background:url(http://.....)
El texto en el recuadro
width:200px;border:2px solid maroon;padding:12px;
Tamaño del cuadro, borde y color.
relative;top:-150px
Con esta medida ubicas de arriba para abajo la posición del recuadro.
1 comentarios :
esta fue una de tus primeras entradas
se nota