Tecnología

Inicio

Cómo hacer un botón de envío en una imagen personalizada

Cómo hacer un botón de envío en una imagen personalizada


Al crear un formulario en su página web, es inevitable que termina con un botón "Enviar". El diseño estándar para este botón es un cuadro gris simple que se obtiene cuando se utiliza la etiqueta HTML <input = "submit">. Si desea cambiar esto para crear algo único para su sitio web, puede hacerlo fácilmente mediante la creación de una imagen y un simple cambio de un bit del código HTML.

Instrucciones

1 Crear una imagen para utilizar como el botón de enviar. Puede crear este usando un programa de software de edición de imágenes, como Photoshop o GIMP. Recuerde colocar texto en la imagen para que se sepa que se trata de la imagen que ellos deben hacer clic. Algo así como "Enviar" o "Haga clic aquí" funciona bien. Guarda la imagen como un archivo JPG o GIF. Recuerde que el nombre del archivo.

2 Almacenar el archivo de imagen en la que va a almacenar otras imágenes. Muchas personas crean un especial de "imágenes" carpeta para sus sitios web. Si lo hace, tendrá que almacenar la imagen en la carpeta "imágenes". Si no es así, se puede guardar la imagen en la carpeta principal.

3 Utilice el código correcto para mostrar la imagen como el botón de enviar. Donde se suele utilizar el código <input type = "submit">, tendrá que cambiar para utilizar una imagen diferente. En su lugar, el código debe leer <input type = "imagen" es el nombre de su archivo. Si ha almacenado el archivo en una carpeta de imágenes, el código debería leer <input type = "imagen" es el nombre de la carpeta y "imagen.jpg" es el nombre del archivo de imagen.

4 Añadir atributos adicionales. Si desea, puede añadir especificaciones adicionales dentro del código, como la "altura", "ancho" y "alt".

Consejos y advertencias

  • Si la imagen no aparece, compruebe que ha escrito el nombre de archivo correcto y el lugar correcto. La capitalización importa.