Con la llegada de CSS3 la web se puso más interesante para la vista. En este artículo, te mostraré algunos efectos para textos usando la propiedad "Text-Shadow", lo cual podrás modificar a tu gusto jugando con los valores.
EFECTO RESPLANDOR
<style type="text/css">
p {
text-shadow: 0 0 .2em white,
0 0 .5em white;
}
</style>
BORDES
<style type="text/css">
p {
text-shadow: 0 1px 1px white, 1px 0 1px white, -1px 0 1px white, 0 -1px 1px white, 1px 1px 1px white, -1px 1px 1px
white, -1px 1px 1px white, -1px -1px 1px white;
}
</style>
MANCHA
<style type="text/css">
p {
color:transparent;
text-shadow:0 0 .2em white;
</style>
FUEGO
<style type="text/css">
a {
padding-top: 40px;
text-shadow: 0 0 4px white, 0 -5px 4px #FF3, 2px -10px 6px #FD3, -2px -15px 11px #F80, 2px -25px 18px #F20;
}
</style>
Los códigos debes de pegar en el "Head" de tu página web. Si quieres pegar directamente en el CSS de la plantilla, elimina <style type="text/css"> y </style>
Los códigos están listos para que se muestre el efecto en todos los textos (<p>). Si quieres para determinados textos como por ejemplo en los títulos debes cambiar "p" por "h1", etc.
ESCRITO POR: Hans H. Aguirre Gómez
Diseñador y Programador Web en el equipo de Webmastercv. Tutoriales para Jimdo en WebmasterCV DESIGN.
Últimos Temas
WEBMASTERCV forma parte del programa Jimdo Experts de Jimdo desde 2012.
Escribir comentario