Tema: ¿Cómo puedo colocar texto dentro de una imagen?
Ver Mensaje Individual
  #13 (permalink)  
Antiguo 07/11/2012, 10:07
Avatar de emprear
emprear
Colaborador
  
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 5 meses
Puntos: 1567
Respuesta: ¿Cómo puedo colocar texto dentro de una imagen?
hacerlo con una imagen de fondo como te indicaron es mucho más sencillo

Código HTML: 
Ver original
  1. <!DOCTYPE html>
  2. <html lang="es-ar">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>Html5</title>
  6. <style type="text/css">
  7. /*<![CDATA[*/
  8. .img{
  9. position: relative;
  10. width: 220px; height: 135px;
  11. padding: 0;
  12. }
  13. .texto{
  14. width: 100%;
  15. position: absolute;
  16. left: 0;
  17. bottom: 0;
  18. background: #000;
  19. margin: 0;
  20. padding: 0;
  21. opacity: .7;
  22. font: bold 11pt tahoma,sans-serif;
  23. }
  24.  
  25. .texto a{
  26. padding: 0 5px;
  27. margin: 0;
  28. display: block;
  29. text-decoration: none;
  30. color: #FFF;
  31. }
  32.  
  33. /*]]>*/
  34. </style>
  35. </head>
  36. <body>
  37. <div style="background-image: url(http://s1.vivirmexico.com/files/2012/11/Familia-Catrina-220x135.jpg)" class="img">
  38. <div class="texto"><a href="http://vivirmexico.com/2012/11/vivir-mexico-pool-dia-de-muertos?utm_source=self&amp;utm_medium=banner&amp;utm_campaign=Destacados%2BHome">Vivir México Pool: Especial de Día de Muertos</a></div>
  39. </div>
  40. </body>
  41. </html>

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.