How to create a file upload button in HTML ?
In this article, we will see how to make a file upload button to upload a file using HTML. As we know, uploading a file is an important aspect in simple HTML form. The file upload button is used to upload a user photo or any type of file in a form.
Approach: For uploading the file using HTML, we will
- create a HTML document that contains an <input> tag.
- use the type attribute which is set to value “file”.
Syntax:
<input type="file">
Example:
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 >w3wiki</ 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 > |
Output: You can see that after the file is uploaded, the name of the file is displayed in front of the button.