Foros del Web » Creando para Internet » HTML »

Imagen de fondo de un boton elastica

Estas en el tema de Imagen de fondo de un boton elastica en el foro de HTML en Foros del Web. Hola amigos de Foros del Web, se que ustedes me pueden ayudar en esto que no se como hacerlo . Miren, quisiera saber como hacer ...
  #1 (permalink)  
Antiguo 27/11/2010, 21:49
 
Fecha de Ingreso: septiembre-2010
Mensajes: 26
Antigüedad: 7 años, 2 meses
Puntos: 1
Imagen de fondo de un boton elastica

Hola amigos de Foros del Web, se que ustedes me pueden ayudar en esto que no se como hacerlo .
Miren, quisiera saber como hacer que la imagen de fondo de un Boton. cambie su ancho y altura para que este totalmente inmersa en el boton, osea que la imagen se vea completa como fondo de un boton.
No se si esto se pueda hacer, pero tengo esperanzas, y gracias por su tiempo y ayuda.
  #2 (permalink)  
Antiguo 27/11/2010, 23:55
Avatar de carlospc  
Fecha de Ingreso: noviembre-2008
Ubicación: Huancayo/Perú
Mensajes: 240
Antigüedad: 9 años, 1 mes
Puntos: 12
Respuesta: Imagen de fondo de un boton elastica

En realidad no se como hacerlo, jeje... pero te puedo sugerir que a tu boton les asignes un ancho y alto determinado y pones la imagen que deseas...

Otra alternativa es que le asignes un alto determinado y utilices como imagen de fondo... una imagen de 1px de ancho y del alto que le asignaste...

Saludos, nos informas como te fue...
__________________
Mi web --> www.CarlosPC.net
  #3 (permalink)  
Antiguo 28/11/2010, 08:33
Avatar de Ventru3  
Fecha de Ingreso: noviembre-2010
Ubicación: Disneylandia
Mensajes: 86
Antigüedad: 7 años
Puntos: 13
Respuesta: Imagen de fondo de un boton elastica

Cuando dices como fondo de un botón, entiendo que es un botón de un formulario en el que la imagen esta dentro, no? En este caso seria así:

Código HTML:
<button name="boton_1" type="button">
<img src="ruta de la imagen" width="ancho de la imagen" height="alto de la imagen" border="0" alt="enviar">
</button> 
O si es una imagen botón así:

Código HTML:
<input type="image" name="boton" src="ruta de la imagen" width="ancho de la imagen" height="alto de la imagen"> 
  #4 (permalink)  
Antiguo 28/11/2010, 09:12
Avatar de carlospc  
Fecha de Ingreso: noviembre-2008
Ubicación: Huancayo/Perú
Mensajes: 240
Antigüedad: 9 años, 1 mes
Puntos: 12
Respuesta: Imagen de fondo de un boton elastica

Para tu boton usa el boton normal pero con clase:

<input type="button" class="claseboton" value="Texto del boton"/>

y en tu css:

.claseboton{
background-image:url(imagen.jpg);
}


Listo... saludos... dame Karma... jeje
__________________
Mi web --> www.CarlosPC.net
  #5 (permalink)  
Antiguo 28/11/2010, 12:41
 
Fecha de Ingreso: septiembre-2010
Mensajes: 26
Antigüedad: 7 años, 2 meses
Puntos: 1
Respuesta: Imagen de fondo de un boton elastica

Cita:
Iniciado por Ventru3 Ver Mensaje
Cuando dices como fondo de un botón, entiendo que es un botón de un formulario en el que la imagen esta dentro, no? En este caso seria así:

Código HTML:
<button name="boton_1" type="button">
<img src="ruta de la imagen" width="ancho de la imagen" height="alto de la imagen" border="0" alt="enviar">
</button> 
O si es una imagen botón así:

Código HTML:
<input type="image" name="boton" src="ruta de la imagen" width="ancho de la imagen" height="alto de la imagen"> 
Hola amigo y gracias por tu respuesta, tu idea se acerca a lo que yo quiero pero lo que sucede es que no puedo escribir sobre la imagen,
Mi idea era tener una imagen de fondo para varios botones de from, los tamaños de los botones varia es por eso que la imagen se autoregule segun el tamño del boton, porfavor si fueras tan amable de ayudarme, si es posibles con java script o algo porque realmente no se como hacerlo
  #6 (permalink)  
Antiguo 28/11/2010, 12:43
 
Fecha de Ingreso: septiembre-2010
Mensajes: 26
Antigüedad: 7 años, 2 meses
Puntos: 1
Respuesta: Imagen de fondo de un boton elastica

Cita:
Iniciado por carlospc Ver Mensaje
Para tu boton usa el boton normal pero con clase:

<input type="button" class="claseboton" value="Texto del boton"/>

y en tu css:

.claseboton{
background-image:url(imagen.jpg);
}


Listo... saludos... dame Karma... jeje
gracias por la ayuda pero
la imagen no se autoregula, estoy usando ese metodo pero no va
  #7 (permalink)  
Antiguo 28/11/2010, 13:58
Avatar de Ventru3  
Fecha de Ingreso: noviembre-2010
Ubicación: Disneylandia
Mensajes: 86
Antigüedad: 7 años
Puntos: 13
Respuesta: Imagen de fondo de un boton elastica

Cita:
Iniciado por jaspher Ver Mensaje
Hola amigo y gracias por tu respuesta, tu idea se acerca a lo que yo quiero pero lo que sucede es que no puedo escribir sobre la imagen,
Mi idea era tener una imagen de fondo para varios botones de from, los tamaños de los botones varia es por eso que la imagen se autoregule segun el tamño del boton, porfavor si fueras tan amable de ayudarme, si es posibles con java script o algo porque realmente no se como hacerlo
Lo mas fácil es que cojas un editor gráfico (paint, photoshop, etc) y en el fondo escribas el texto que quieras. Para cada botón deberas guardar una imagen si quieres que en cada uno, el texto sea diferente.
  #8 (permalink)  
Antiguo 28/11/2010, 14:53
Avatar de carlospc  
Fecha de Ingreso: noviembre-2008
Ubicación: Huancayo/Perú
Mensajes: 240
Antigüedad: 9 años, 1 mes
Puntos: 12
Respuesta: Imagen de fondo de un boton elastica

El texto agregalo de la misma manera que a un buton normal... con la propiedad

value="Texto del Boton"

No deberia haber mayor problema, a la imagen de fondo puedes centralo verticalmente si deseas...

Ahora por lo de utilizar una imagen en concreto que se adapte a varios tamaños... no me la se ahorita... pero si consigo una te la paso...

Ten en cuenta que al modificar los tamaños de una imagen a una que no sea la original... esta se va ver de manera distorcionada... con poca estetica...
__________________
Mi web --> www.CarlosPC.net
  #9 (permalink)  
Antiguo 29/11/2010, 01:26
 
Fecha de Ingreso: diciembre-2009
Mensajes: 53
Antigüedad: 8 años
Puntos: 4
Respuesta: Imagen de fondo de un boton elastica

Prueba a buscar en google una técnica que se llama Sliding Doors. Con esta técnica podrás hacer que el fondo de tu botón crezca según el contenido que tenga.

Espero que te sirva de ayuda !

Etiquetas: elastica, fondo, botones
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




La zona horaria es GMT -6. Ahora son las 09:26.