This line of code:
<input name="img" type="file" accept="image/*" capture="camera" onchange="uploadImage(this, 75)" />
fails to pass the W3C HTML5 validator check:
I would appreciate anyone letting me know why the error from W3C (and any solution), given that the code works fine and it opens the camera for mobile devices.
It was a bug in the validator.
Even when the capture
attribute didn't, so far, make its way into the HTML spec , it has already the "W3C Recommendation" status ( HTML Media Capture ). Therefore, it should have been included in the validator.
On March 2018, an issue was raised in the W3C mailing list and a member of the validator team acknowledged it. It was fixed on March 21, 2020 .
If you want to know more about the correct syntax regarding HTML Media Capture, have a look at this article .
label.cameraButton { display: inline-block; margin: 1em 0; /* Styles to make it look like a button */ padding: 0.5em; border: 2px solid #666; border-color: #EEE #CCC #CCC #EEE; background-color: #DDD; } /* Look like a clicked/depressed button */ label.cameraButton:active { border-color: #CCC #EEE #EEE #CCC; } /* This is the part that actually hides the 'Choose file' text box for camera inputs */ label.cameraButton input[accept*="camera"] { display: none; }
<!DOCTYPE html> <html> <body> <label class="cameraButton">📷 <input type="file" accept="image/*;capture=camera"> </label> </body> </html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.