Problem StatementCreate one form having following fields1) Email ( with html5 email validation).2) Password (It should take minimum 6 charactors ).3) Your project URL ( with html5 url validation).4) Project completion date ( with html5 date validation).5) Current month ( with html5 month validation).6) Current week (with html5 week validation).7) Current time (with html5 time validation).8) Select color (with html5 color features).9) Age (with html5 range features and also show the selected age ).10) Your hobbies (with html5 data list ).Expected outputSolution<head>        <title>Form validation</title>        <meta charset=UTF-8>        <style type=text/css>            form, p{                width: 18%;                margin: auto;            }            form *{                height: 30px;            }            form > input[type=text]{                height: 50px;            }        </style>    </head>    <body>        <p>Fill The Form</p><br><br><br>        <form method=POST action=javascript:void(0) enctype=multipart/form-data>                <input type=email name=email_id placeholder=Email required autocomplete=off autofocus=on pattern=^[A-Za-z0-9_-.]+@[A-Za-z-]{3, 4}\.[A-Za-z]{2, 3}$><br>                <input type=password name=password placeholder=Password required autocomplete=on pattern=^[A-Za-z0-9_.-]{6, 10}$><br>                <input type=url name=url placeholder=your project URL required autocomplete=on><br>                <input type=date name=projectCompletionDate placeholder=Project completion date required autocomplete=off><br>                <input type=month placeholder=Current month required autocomplete=on><br>                <input type=week placeholder=Current week required autocomplete=on><br>                <input type=time placeholder=Current time required autocomplete=on><br>                <label>Select color:</label><input type=color required autocomplete=on><br>                <label>Age:</label><input type=range required autocomplete=on><br>                <label>Hobbies:</label><input list=hobbies name=hobby>                                          <datalist id=hobbies>                                            <option value=Soccer>                                            <option value=Reading>                                            <option value=Golf>                                            <option value=Swimming>                                            <option value=Tennis>                                          </datalist>                <input type=submit value=Submit Query>        </form>    </body>1) Can this solution be improved?2) Can regex patterns be avoided?
HTML 5 form validation and form handling
css;html5;form