Open In App

How to set input type date in dd-mm-yyyy format using HTML ?

Improve
Improve
Like Article
Like
Save
Share
Report

To set and get the input type date in dd-mm-yyyy format we will use <input> type attribute. The <input> type attribute is used to define a date picker or control field. In this attribute, you can set the range from which day-month-year to which day-month-year date can be selected from. If min and max values are not set then the default min value is set to “01-01-1920” and default max value is set to “01-01-2120”.

Example 1: This example uses <input type=”date”> attribute to get the date in dd-mm-yyyy format.

HTML




<!DOCTYPE html> 
<html
  
<head
    <title
        How to get input type date 
        in dd-mm-yyyy format ? 
    </title
      
    <style
        body { 
            text-align: center; 
        
        h1 { 
            color: green; 
        
    </style
</head
  
<body
    <h1>GeeksforGeeks</h1
      
    <h3
        Get input date in 
        dd-mm-yyyy format 
    </h3
      
    <label for="start"
        Enter the Date: 
    </label
  
    <input type="date" name="begin"
        placeholder="dd-mm-yyyy" value=""
        min="1997-01-01" max="2030-12-31"
</body
  
</html>


Output:

javscrip3

Example 2: This example uses <input type=”date”> attribute to get the date in dd-mm-yyyy format.

HTML




<!DOCTYPE html> 
<html
  
<head
    <title
        How to get input type date 
        in dd-mm-yyyy format ? 
    </title
      
    <style
        body { 
            text-align: center; 
        
        h1 { 
            color: green; 
        
    </style
</head
  
<body
    <h1>GeeksforGeeks</h1
      
    <h3
        Get input date in 
        dd-mm-yyyy format 
    </h3
      
    <label for="Date of Birth"
        Enter the Date: 
        <input type="date" name="date"
    </label
</body
  
</html>


Output:

javscrip3

HTML is the foundation of webpages, is used for webpage development by structuring websites and web apps.You can learn HTML from the ground up by following this HTML Tutorial and HTML Examples.



Last Updated : 12 Jan, 2024
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads