Como puedo hacer que un texto tenga sombra poniedolo en el estilo ???
Grax...
19/06/2003, 09:05
| ||||
| ||||
| <div style="position: relative; color: #000000; font-style: italic; font-weight: bold; font-size: 22pt;">Texto <div style="position: absolute; top: -1px; left: -1px; color: #336699;">Texto</div> </div>
__________________ ¡¡NO A LA GUERRA!! Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares! |
|
19/06/2003, 09:33
| ||||
| ||||
| Pues no hay más que trasladar lo mismo a la hoja de estilo y luego usar class. <html> <head> <style type="text/css"> .sombra{ color: #000000; font-style: italic; font-weight: bold; font-size: 22pt; position: relative; } .texto{ color: #336699; top: -1px; left: -1px; position: absolute; } </style> </head> <body> <div class="sombra">Texto<div class="texto">Texto</div></div> </body> </html> Realmente lo único importante para crear la sombra es lo que está en negrita .
__________________ ¡¡NO A LA GUERRA!! Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares! Última edición por Bravenap; 19/06/2003 a las 09:41 |
|
19/06/2003, 09:38
| ||||
| ||||
| Lo malo es que la pagina esta centrada y no puedo usar layers ya que estos quedan fijo en un punto... He encontrado los siguientes codigos: text-shadow: black 3px 3px, yellow -3px -3px text-shadow: black 3px 3px 2px, yellow -3px -3px pero funcionan solo para css2... no se aplicar el css2... Como se hace ???
__________________ |
|
19/06/2003, 09:45
| ||||
| ||||
| ¿Estás seguro de que te quedan fijos en un sitio? La capa prinicipal está en posición relativa y no está especificada su posición. No tendría por qué quedar fija en ningún punto. La que sí está en posición absoluta es la capa que está dentro, por lo que su posición absoluta está referida a la otra capa, no a la página.
__________________ ¡¡NO A LA GUERRA!! Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares! |
|
19/06/2003, 10:22
| ||||
| ||||
| Hola ztikmz, si es posible darle sombra a un texto mediante CSS, pon esto en el estilo al que quieras darle sombra. filter: DropShadow(Color=#000000, OffX=1, OffY=1); puedes cambarle el color y la posición de la sombra, eso si, siempre aparecerá a 45º. Otra opción de sombra es: filter: Shadow(Color=#000000, Direction=135); pero más que sombra es una especie de movimiento, en el si puedes definir a donde va la sombra, pero no la longitud. Prueba a ver cual te gusta más. Se me olviadaba ponerte este: filter: Blur(Add=yes, Direction=135, Strength=5); este es parecido al segundo, en el si puedes definir la longitud de la sombra, pero el color es el que le asignes tu al texto. A ver si alguno de ellos te sirve. Duerte
__________________ "En cuanto a mí, sólo sé que no sé nada" Sócrates |
|
19/06/2003, 11:41
| ||||
| ||||
| gracias a ambos... quiero usar este codigo: filter: DropShadow(Color=#000000, OffX=1, OffY=1); pero como debo poner en la hoja de estilos ?? asi: .sombra: { DropShadow: Color=#000000 OffX=1, OffY=1 }
__________________ |
|
19/06/2003, 12:02
| ||||
| ||||
| Hola, ztikma. Te dejo el enlace a una página donde se explica el filtro que te comenta regui, y algunos más. Te comento que, salvo que yo esté equivocado, solo funcionan en Internet Explorer (no se en que versiones) excepto el filtro Alpha que tiene un equivalente para Netscape. http://www.csstile.8m.net/ Espero que te ayude. Saludos,  |
|
19/06/2003, 13:37
| ||||
| ||||
| para ponerlo en el CSS, tienes que ponerlo tal que asi: .sombra: { filter: DropShadow(Color=#000000, OffX=1, OffY=1); } con el filter: incluido. En cuanto a lo que dice JavierB, tiene razón solo funcionan para IE  , pero es lá única manera de darle sombra a un texto por CSS.
__________________ "En cuanto a mí, sólo sé que no sé nada" Sócrates |
|
20/06/2003, 01:19
| ||||
| ||||
| Hola a todos. De verdad que estoy probando todo esto y a mí no me aparece ninguna sombra por ningún lado. Pero además con ninguna de las tres posibilidades. Tengo IE 6.0 así que en principio debería funcionar ¿no? Un saludo.
__________________ ¡¡NO A LA GUERRA!! Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares! |
|
20/06/2003, 01:25
| ||||
| ||||
|
Código:
_____________________ | | | VAMONOS TODOS A CSS | |_____________________|
__________________ Cómo escribir No hay pregunta tonta, sino tonto que quiere seguir en la ignorancia. |
|
20/06/2003, 03:03
| ||||
| ||||
| Dices que no te funciona? es raro, yo también tengo IE 6.0 y no me da ningún problema. Prueba con este código a ver? <html> <head> <title>Sombra</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- .sombra { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; color: #006600; text-decoration: none; filter: DropShadow(Color=#FF0000, OffX=3, OffY=3); } --> </style> </head> <body> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td align="center" class="sombra">texto de prueba</td> </tr> </table> </body> </html> De exho si no tengo mal entendido solo funciona a partir de IE 5.0
__________________ "En cuanto a mí, sólo sé que no sé nada" Sócrates |
|
20/06/2003, 03:14
| ||||
| ||||
| Ahora sí. El caso es que yo lo ponía en la etiqueta DIV y así no rulaba: <div class="sombra">texto</div>   Gracias.
__________________ ¡¡NO A LA GUERRA!! Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares! |
|
20/06/2003, 03:25
| ||||
| ||||
| Es curioso que en la etiqueta DVI no funcione, si sabía que si le asignas la clase al body tampoco la coge, aunque si coge las propiedades de fuente tamaño etc... pero la sombra no. No tengo ni idea de porque es asi.
__________________ "En cuanto a mí, sólo sé que no sé nada" Sócrates |
|
20/06/2003, 06:24
| ||||
| ||||
| Hola a todos. Puede usarse también con un <div> añadiendo al estilo el atributo height: .sombra { filter: DropShadow(Color=red, OffX=2, OffY=2); height:1; } Espero que os/nos sirva. Saludos, |
|
20/06/2003, 06:38
| ||||
| ||||
 ¡Curioso, sí señor!  También con width.... si es que esto del internés es, en dos palabras, im-prezionante.
__________________ ¡¡NO A LA GUERRA!! Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares! |
|
10/03/2005, 03:31
| ||||
| ||||
| y si solo quiero que se muestre cuando estoy encima del texto? |
|
10/03/2005, 04:32
| ||||
| ||||
| Para eso tendrías que poner un evento onMouseOver sobre la capa. Más o menos así:
Código:
<div class="" onMouseOver="this.className='sombra'" onMouseOut="this.className=''">texto</div>
__________________ ¡¡NO A LA GUERRA!! Si ponemos a nuestros mensajes títulos adecuados, la gente se animará más a abrirlos y resultarán más útiles en las busquedas. ¡No a los ayuuudaaa, urgenteee y similares! |
|
12/03/2005, 16:40
| |||
| |||
| Hola todos : también se puede hacer con CSS, pero usando hover en enlaces. Por supuesto que si se anula el click con JS es lo mismo que un texto. Letras con borde de otro color El ejemplo usa las capas para poner un "borde". Para "sombra" es igual, pero más desplazado. saludos furoya |
|
12/03/2005, 16:48
| ||||
| ||||
| pero JavierB, los efectos del enlace q das no funcionan en FireFox!!
__________________ Hay 10 tipos de personas: las que saben binario y las que no. |
|
13/03/2005, 12:36
| ||||
| ||||
| ya suponia... grrr no quiero caer en el anti-microsoft q me caracteriza...
__________________ Hay 10 tipos de personas: las que saben binario y las que no. |
