lunes, 19 de agosto de 2013

POSIT
CABE DE TODO


UN RECUADRO ORIGINAL
Puedes escribir lo que quieras incluso código. Ponle imaginación.
EL CÓDIGO:

CSS:
<style>
.stitched { padding: 20px;*/ANCHURA DEL RECTANGULO*/; margin: 10px; background: #0F4652;*/COLOR DEL FONDO*/; color: #85FFFD;*/COLOR DE LA LETRA*/; font-size: 31px;*/TAMAÑO DE LA LETRA*/; font-weight: bold; line-height: 1.3em;*/ANCHURA DEL RECTANGULO*/; border: 2px dashed #FFFFFF;*/COLOR DEL PESPUNTE DEL RECTANGULO*/; border-radius: 10px;*/EL REDONDEO DE LAS ESQUINAS*/; box-shadow: 0 0 0 4px #0F4652, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);*/COLOR DEL MARCO*/; text-shadow: -1px -1px #0F4652;*/COLOR DEL PESPUNTE DE LA LETRA*/; font-weight: normal; text-align:center; }
</style>
HTML:
<div class="stitched"> ENTRE ESTE DIV, PODEÍS COLOCAR, CASI CUALQUIER COSA. </div>
LO ENCONTRÉ AQUÍ:

domingo, 11 de agosto de 2013

TODO EN CAJAS
ASÍ TODO ENCAJA

En esta caja con sombra, hecha integramente en css, podreís colocar el texto que deseís; un enlace... pero, también, código de cualquier otra índole: script, html... Visita este sitio hay más: www.araudi.net A modo de ejemplo esta entrada.
Además no tendremos que preocuparnos de la largura de la caja, puesto que irá creciendo a medida en que vayamos agregando cosas.
AQUÍ OS DEJO EL CÓDIGO
(dentro del mismo encontrareis algunas ayudas entre este distintivo */ )
<style type="text/css"> #a, #b, #c, #d, #e, #f, #g, #h, #i {position: relative; bottom: 1px; right: 1px; width: 300px;*/es el ancho de la caja*/ } #i { background-color: #43758C;} */es el color del fondo*/ #h { background-color: #464646;} #g { background-color: #5F5F5F;} #f { background-color: #812781;}*/es el color del marco*/ #e { background-color: #919191;} #d { background-color: #AAA;} #c { background-color: #C3C3C3;} #b { background-color: #DCDCDC;} #a { background-color: #F5F5F5; margin: 20px auto;*/el margen de colocación a lo alto dentro de la pagina, widget o entrada*/ } #texto { text-align:justify; font-size: x-large; color: #F9DDC1; padding: 10px; } */el estilo del texto ir agregando*/ a {color: #F4F424}*/el color del enlace*/ </style> <div id="a"> <div id="b"> <div id="c"> <div id="d"> <div id="e"> <div id="f"> <div id="g"> <div id="h"> <div id="i"> <div id="texto">En esta caja con sombra, hecha integramente en css, podreís colocar el texto que deseís; un enlace. pero, tambien, código de cualquier otra indole: script, hatml... </div> </div> </div> </div> </div> </div> </div> </div> </div> </div>