HTML Date
Home
Snippets
HTML Date
HTML
CSS
JS
<body> <div class="date-form"> <h2>Select a Date</h2> <form> <label for="date">Choose a date:</label> <input type="date" id="date" name="date"> <input type="submit" value="Submit"> </form> </div> </body>
body { display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; font-family: Arial, sans-serif; background-color: #f4f4f9; } .date-form { background-color: #ffffff; padding: 20px; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); text-align: center; width: 300px; } label { font-size: 1.1em; color: #333333; } input[type="date"] { width: 100%; padding: 10px; margin-top: 10px; margin-bottom: 20px; border: 1px solid #ddd; box-sizing: border-box; border-radius: 4px; font-size: 1em; color: #555; outline: none; transition: border-color 0.3s ease; } input[type="date"]:focus { border-color: #4CAF50; } input[type="submit"] { background-color: #4CAF50; color: #ffffff; padding: 10px 20px; border: none; border-radius: 4px; font-size: 1em; cursor: pointer; transition: background-color 0.3s ease; } input[type="submit"]:hover { background-color: #45a049; }
// javascript
Ad #1
Ad #2
Scroll to Top