Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje31-01-2013, 18:46 (UTC)    
Título del mensaje: Tutorial CSS - Notas ideales para anotaciones

Tutorial - Notas ideales para anotaciones
creado por Nesbet

===================================================================================================

Vista previa



Tutorial

Primer paso: Copiar y pegar el siguiente código en "CSS-Code sin Style Tags"
Lo que está a color puede usted editarlo y escoger el color que usted desee.

Cita:
.stickynote {
width: 234px;
margin: 3px;
float: left;
border-left: 4px solid #e32d1f;
-webkit-box-shadow: 0px 3px 4px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0px 3px 4px 1px rgba(0, 0, 0, 0.1);
font-family:'Helvetica Neue',Arial,Tahoma;
}

.stickynote span.top {
display: block;
height: 32px;
background: url("http://i.imgur.com/s9Upk5V.png") repeat scroll 0% 0% transparent;
}

.stickynote span.bottom {
height: 40px;
display: block;
background: url("http://i.imgur.com/GLnG2P6.png") repeat scroll 0% 0% transparent;
}


.stickynote .content {
background: url("http://i.imgur.com/d3C1YgB.png") repeat scroll 0% 0% transparent;
color: rgb(104, 106, 107);
font-size: 14px !important;
word-wrap: break-word;
padding: 0px 7px 0px 27px;
line-height: 21px;
}


Primer paso: Copiar y pegar el siguiente código en donde usted desee que aparezca la nota.
Si desea pegarlo en alguna de sus páginas, recuerden tener activada la función de "Fuente HTML" en su edito.

Cita:
<div class="stickynote">
<span class="top"></span>
<div class="content">
TEXTO
</div>
<span class="bottom"></span>
</div>


Más información!

¿Quiere editar la nota en toda su totalidad? Entonces visite el siguiente link, para poder descargar su archivo PSD y CSS.
http://www.paginawebgratis.es/forum/viewtopic.php?t=71734

===================================================================================================

Bueno amigos, esto fué todo, espero que les haya gustado.
Hasta la próxima!


Ultima edición por nesbet el Jue Mar 07, 2013 11:49 am; editado 4 veces
Mensaje05-03-2013, 16:24 (UTC)    
Título del mensaje:

Pues en si, el codigo deberia ser asi

Cita:
<div class="stickynote"><span class="top"></span><div class="content">
TEXTO
<span class="bottom"></span>
</div></div>


Y se le modificamos el class top, podriamos poner el color del texto en negro bold para que fuera el titulo como tal.

De no ser asi quedaria mucho codigo que no estas utilizando D:
Mensaje06-03-2013, 19:44 (UTC)    
Título del mensaje:

Muy buen tip nesbet!

Tambien servira para los que utilizan "citas" o "quotes" es sus paginas..
Para dar ejemplos de algo etc..

Saludos!
______________
Cssplantillas - Moderador Paginawebgratis.es
Email: cssplantillas@gmail.com -Twitter // @cssplantillas
Mensaje07-03-2013, 15:49 (UTC)    
Título del mensaje:

@dedydamys terrible error me mandé! gracias por el aviso, ya lo arreglé, se ve que copie mal el código.
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group