Blog IT

If you use <input type="file">, it will accept all file types. But it is possible to restrict the file types to only images, or certain image file extensions. To achieve this, you need to use the HTML accept attribute. This attribute is only used with <input type="file"> and serves as a filter to select file inputs from the file input dialog box.

<!DOCTYPE html>
<html>
  <head>
    <title>How to Allow the File Input Type to Accept Only Image Files</title>
  </head>
  <body>
    <input type="file" id="img" name="img" accept="image/*">
    <input type="file" name="myImage" accept="image/x-png,image/gif,image/jpeg" />
  </body>
</html>