Foros del Web » Creando para Internet » CSS »

Imagen en tag a

 Estas en el tema de Imagen en tag a en el foro de CSS en Foros del Web. Bueno quiero poner una imagen en un link para que sea un botón.... Este es mi código: Código HTML: <body> <!-- *********************************** START THE LAYOUT ...
  #1 (permalink)  
Antiguo 02/09/2011, 20:17
 
Fecha de Ingreso: mayo-2010
Mensajes: 53
Antigüedad: 13 años, 11 meses
Puntos: 0
Imagen en tag a
Bueno quiero poner una imagen en un link para que sea un botón.... Este es mi código:

Código HTML:
<body>

<!-- 
***********************************

START THE LAYOUT SITE

************************************ 
-->
 
 <div class="wrapper"></div>
     <div id="container">
         <div id="header">
             <ul id="main_menu">
                <li class="first_element"><a href="index.html">Inicio</a></li>
                <li><a href="acciones.html">Acciones</a></li>
                <li><a href="carrerasycursos.html">Carreras y Cursos</a></li>
                <li><a href="profesionales.html" class="selected">Profesionales</a></li>
                <li><a href="publicaciones.html">Publicaciones</a></li>
                <li><a href="noticias.html">Noticias</a></li>
                <li><a href="agenda.html">Agenda</a></li>
                <li><a href="contacto.html">Contacto</a></li>
             </ul>
         </div>
         <!-- END HEADER -->
         
         <!-- BOX -->
         <div id="boxcontent">
     <center><img src="images/banners/profesional.png" width="790" height="180" border="0" alt="Inicio" 

/></center><br />
             <div id="box_text">
                <h2>Profesionales</h2>
<table border="0" cellpadding="0" cellspacing="0" width="550">
<tr>
<td width="183"><img src="images/cv/quellet.jpg" width="90" height="75" class="cv-img"></td>
<td width="183" valign="middle"><strong> Ricardo Luis Quellet</strong></td>
<td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
</tr>
</table><br />

<table border="0" cellpadding="0" cellspacing="0" width="550">
<tr>
<td width="183"><img src="images/cv/john doe.jpg" width="90" height="75" class="cv-img"></td>
<td width="183" valign="middle"><strong> Jorge Alberto Espina</strong></td>
<td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
</tr>
</table><br />

<table border="0" cellpadding="0" cellspacing="0" width="550">
<tr>
<td width="183"><img src="images/cv/3.jpg" width="90" height="75" class="cv-img"></td>
<td width="183" valign="middle"><strong> Ana Mar&iacute;a Lamas</strong></td>
<td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
</tr>
</table><br />

<table border="0" cellpadding="0" cellspacing="0" width="550">
<tr>
<td width="183"><img src="images/cv/4.jpg" width="90" height="75" class="cv-img"></td>
<td width="183" valign="middle"><strong> Mar&iacute;a Jos&eacute; Espona</strong></td>
<td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
</tr>
</table><br />

<table border="0" cellpadding="0" cellspacing="0" width="550">
<tr>
<td width="183"><img src="images/cv/5.jpg" width="90" height="75" class="cv-img"></td>
<td width="183" valign="middle"><strong> Silvia Capuz</strong></td>
<td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
</tr>
</table><br />

<table border="0" cellpadding="0" cellspacing="0" width="550">
<tr>
<td width="183"><img src="images/cv/6.jpg" width="90" height="75" class="cv-img"></td>
<td width="183" valign="middle"><strong> Enrique O. Gussoni</strong></td>
<td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
</tr>
</table><br />

<table border="0" cellpadding="0" cellspacing="0" width="550">
<tr>
<td width="183"><img src="images/cv/7.jpg" width="90" height="75" class="cv-img"></td>
<td width="183" valign="middle"><strong> Mabel Cristina Pilomeno</strong></td>
<td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
</tr>
</table><br />

<table border="0" cellpadding="0" cellspacing="0" width="550">
<tr>
<td width="183"><img src="images/cv/8.jpg" width="90" height="75" class="cv-img"></td>
<td width="183" valign="middle"><strong> Cristina Lamas</strong></td>
<td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
</tr>
</table>
                <div id="bottom-action"><img src="images/bg-aboutus-narrow-bottom.gif" width="550" height="14" 

border="0" alt="Bottom" /></div>
            </div>
            
            <!-- END BOX -->
                <div id="footer">
                <p class="menu_bottom"><a href="index.html">Inicio</a> | <a href="acciones.html">Acciones</a> | 

<a href="carrerasycursos.html">Carreras y Cursos</a> | <a href="profesionales.html">Profesionales</a> | <a 

href="noticias.html">Noticias</a> | <a href="agenda.html">Agenda</a> | <a href="contacto.html">Contacto</a>
                <p>© 2011 Centro Ficch - Todos los derechos reservados - <a 

href="terminos.html">T&eacute;rminos y Condiciones</a> | <a href="mapa.html">Mapa del sitio</a></p><br />
                <p class="last">Franklin D.Roosevelt 3423 5º "19", Capital Federal - Buenos Aires, Argentina | 

<a href="admin/index.php">&Aacute;rea para miembros</a></p><br />
                <p class="last">Diseño del sitio: Alejo Zambecchi | Colaboraci&oacute;n: Mateo Miccino</p>
                </div>
                <div id="bottom-footer"><img src="images/bottom-footter.gif" width="800" height="54" border="0" 

alt="Bottom" /></div>
     </div>
     <!-- END CONTENT CONTAINER -->
 </div>
 
<!-- 
***********************************

END THE LAYOUT SITE

************************************ 
-->

</body>
</html>
Código CSS: 
Ver original
  1. /*----------------------------------------
  2. professional
  3. ----------------------------------------*/
  4.     a.mini-cv {
  5.         background:url(images/btn-mini-cv.gif) left top no-repeat;
  6.         text-indent:-9999em;
  7.         display:block;
  8.         height:27px;
  9.         width:92px;
  10.         margin:0 auto;
  11.     }
  12.         a.mini-cv:hover {
  13.             background:url(images/btn-mini-cv.gif) left bottom no-repeat;
  14.         }

El botón es este:

Alguna sugerencia de como arreglarlo para que se vea? :/
  #2 (permalink)  
Antiguo 02/09/2011, 23:49
Avatar de andresdzphp
Colaborador
  
Fecha de Ingreso: julio-2011
Ubicación: $this->Colombia;
Mensajes: 2.749
Antigüedad: 12 años, 9 meses
Puntos: 793
Respuesta: Imagen en tag a
Pues a mi me funciona perfectamente con lo que tienes... tal vez sea porque en el código se llama la imagen

btn-mini-cv.gif

y en la imagen que pusiste de ejemplo:

btnminicv.gif

Revisa el nombre y ruta de la imagen.
__________________
Si sabemos como leer e interpretar el manual será mucho más fácil aprender PHP. En lugar de confiar en ejemplos o copiar y pegar - PHP
  #3 (permalink)  
Antiguo 03/09/2011, 12:55
 
Fecha de Ingreso: mayo-2010
Mensajes: 53
Antigüedad: 13 años, 11 meses
Puntos: 0
Respuesta: Imagen en tag a
Que raro eso... igualmente por las dudas le puse a la imagen el nombre btnminicv.gif y en el código lo puse igual y sigue sin andarme -.- ajajaja Me queda así todavía....



Acá esta la carpeta para que vean que la ruta esta bien :/



Código CSS: 
Ver original
  1. /*----------------------------------------
  2. professional
  3. ----------------------------------------*/
  4.     a.mini-cv {
  5.         background:url(images/btnminicv.gif) left top no-repeat;
  6.         text-indent:-9999em;
  7.         display:block;
  8.         height:27px;
  9.         width:92px;
  10.         margin:0 auto;
  11.     }
  12.         a.mini-cv:hover {
  13.             background:url(images/btnminicv.gif) left bottom no-repeat;
  14.         }
Código HTML: 
Ver original
  1. <div id="boxcontent">
  2.      <center><img src="images/banners/profesional.png" width="790" height="180" border="0" alt="Inicio" /></center><br />
  3.              <div id="box_text">
  4.                 <h2>Profesionales</h2>
  5. <table border="0" cellpadding="0" cellspacing="0" width="550">
  6. <tr>
  7. <td width="183"><img src="images/cv/quellet.jpg" width="90" height="75" class="cv-img"></td>
  8. <td width="183" valign="middle"><strong> Ricardo Luis Quellet</strong></td>
  9. <td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
  10. </tr>
  11. </table><br />
  12.  
  13. <table border="0" cellpadding="0" cellspacing="0" width="550">
  14. <tr>
  15. <td width="183"><img src="images/cv/john doe.jpg" width="90" height="75" class="cv-img"></td>
  16. <td width="183" valign="middle"><strong> Jorge Alberto Espina</strong></td>
  17. <td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
  18. </tr>
  19. </table><br />
  20.  
  21. <table border="0" cellpadding="0" cellspacing="0" width="550">
  22. <tr>
  23. <td width="183"><img src="images/cv/3.jpg" width="90" height="75" class="cv-img"></td>
  24. <td width="183" valign="middle"><strong> Ana Mar&iacute;a Lamas</strong></td>
  25. <td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
  26. </tr>
  27. </table><br />
  28.  
  29. <table border="0" cellpadding="0" cellspacing="0" width="550">
  30. <tr>
  31. <td width="183"><img src="images/cv/4.jpg" width="90" height="75" class="cv-img"></td>
  32. <td width="183" valign="middle"><strong> Mar&iacute;a Jos&eacute; Espona</strong></td>
  33. <td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
  34. </tr>
  35. </table><br />
  36.  
  37. <table border="0" cellpadding="0" cellspacing="0" width="550">
  38. <tr>
  39. <td width="183"><img src="images/cv/5.jpg" width="90" height="75" class="cv-img"></td>
  40. <td width="183" valign="middle"><strong> Silvia Capuz</strong></td>
  41. <td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
  42. </tr>
  43. </table><br />
  44.  
  45. <table border="0" cellpadding="0" cellspacing="0" width="550">
  46. <tr>
  47. <td width="183"><img src="images/cv/6.jpg" width="90" height="75" class="cv-img"></td>
  48. <td width="183" valign="middle"><strong> Enrique O. Gussoni</strong></td>
  49. <td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
  50. </tr>
  51. </table><br />
  52.  
  53. <table border="0" cellpadding="0" cellspacing="0" width="550">
  54. <tr>
  55. <td width="183"><img src="images/cv/7.jpg" width="90" height="75" class="cv-img"></td>
  56. <td width="183" valign="middle"><strong> Mabel Cristina Pilomeno</strong></td>
  57. <td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
  58. </tr>
  59. </table><br />
  60.  
  61. <table border="0" cellpadding="0" cellspacing="0" width="550">
  62. <tr>
  63. <td width="183"><img src="images/cv/8.jpg" width="90" height="75" class="cv-img"></td>
  64. <td width="183" valign="middle"><strong> Cristina Lamas</strong></td>
  65. <td width="183"><a href="quellet.html" class="mini-cv">Ver mini-cv</a></td>
  66. </tr>
  67. </table>
  68.                 <div id="bottom-action"><img src="images/bg-aboutus-narrow-bottom.gif" width="550" height="14" border="0" alt="Bottom" /></div>
  69.             </div>
  #4 (permalink)  
Antiguo 03/09/2011, 13:06
Avatar de andresdzphp
Colaborador
  
Fecha de Ingreso: julio-2011
Ubicación: $this->Colombia;
Mensajes: 2.749
Antigüedad: 12 años, 9 meses
Puntos: 793
Respuesta: Imagen en tag a
y donde tienes el archivo css? esa ruta es la que te debe estar molestando. Si coloco el código css en el mismo archivo html funciona:


http://3.bp.blogspot.com/-qeU6Yhm0Gg...s1600/ummm.jpg

Que navegador usas?
__________________
Si sabemos como leer e interpretar el manual será mucho más fácil aprender PHP. En lugar de confiar en ejemplos o copiar y pegar - PHP
  #5 (permalink)  
Antiguo 03/09/2011, 13:16
 
Fecha de Ingreso: mayo-2010
Mensajes: 53
Antigüedad: 13 años, 11 meses
Puntos: 0
Respuesta: Imagen en tag a
Aquí están todos los archivos..... Uso google chrome. Igualmente lo probé en el firefox y tampoco funciona.



edit: Gracias andres! Intente insertado el código en el mismo html como vos dijiste y funciono... No sé porque de la otra forma no anda jajajaja, muchas gracias.

Etiquetas: html, tag, fondo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 18:16.