¿Cómo crear un botón de carga de archivos en HTML?

En este artículo, veremos cómo hacer un botón de carga de archivos para cargar un archivo usando HTML. Como sabemos, cargar un archivo es un aspecto importante en un formulario HTML simple. El botón de carga de archivos se utiliza para cargar una foto de usuario o cualquier tipo de archivo en un formulario. 

Enfoque: para cargar el archivo usando HTML, haremos

  • cree un documento HTML que contenga una etiqueta <input>.
  • use el atributo de tipo que se establece en el valor «archivo».

Sintaxis:

<input type="file">

Ejemplo:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>HTML input type file</title>
 
    <!--CSS code-->
    <style>
        h1 {
            color: green;
        }
 
        h2,
        h3 {
            font-family: Impact;
        }
 
        body {
            text-align: center;
        }
    </style>
</head>
 
<body>
    <h2>GeeksforGeeks</h2>
    <h3>
        How to create a file Upload
        Button using html?
    </h3>
     
    <label> Choose the File to upload: </label>
    <input type="file" id="myFile" /> <br /><br />
     
    <input type="submit" value="submit" />
</body>
 
</html>

Salida: puede ver que después de cargar el archivo, el nombre del archivo se muestra frente al botón. 

Botón de carga de archivos en HTML

Publicación traducida automáticamente

Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *