---
# System prepended metadata

title: Session 03 Task

---

Session 03 Task
===

## Note: MDN Reference For Each Type Is Available

### 1. [input type date](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date)

Create input fields that let the user enter a date, either with a textbox that validates the input or a special date picker interface.

```htmlembedded=1
<input type="date" name="" id="" min="" max="" />
```
---
### 2. [input type time](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time)

Create input fields designed to let the user easily enter a time (hours and minutes, and optionally seconds).

```htmlembedded=1
<input type="time" name="" id="" min="" max="" />
```
---
### 3. [input type color](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/color)

Provide a user interface element that lets a user specify a color, either by using a visual color picker interface or by entering the color into a text field in #rrggbb hexadecimal format.

```htmlembedded=1
<input type="color" name="" id="" />
```
---
### 4. [input type month](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/month)

Create input fields that let the user enter a month and year allowing a month and year to be easily entered.

```htmlembedded=1
<input type="month" name="" id="" min="" max="" />
```
---
### 5. [input type range](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range)

Let the user specify a numeric value which must be no less than a given value, and no more than another given value.

```htmlembedded=1
<input type="range" name="" id="" min="" max="" />
```
---
### 6. [input type tel](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/tel)

It is used to let the user enter and edit a telephone number.

```htmlembedded=1
<input type="tel" name="" id="" pattern="" />
```
---
### 7. [input type url](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/url)

It is used to let the user enter and edit a URL.

```htmlembedded=1
<input type="url" name="" id="" />
```
---
### 8. [input type week](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/week)

Create input fields allowing easy entry of a year plus the [ISO 8601 week number](https://en.wikipedia.org/wiki/ISO_8601#Week_dates) during that year.

```htmlembedded=1
<input type="week" name="" id="" />
```
---
### 9. [input type search](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/search)

It is a text field designed for the user to enter search queries into.

```htmlembedded=1
<input type="search" name="" id="" />
```
---
### 10. [input type datetime-local](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local)

Create input controls that let the user easily enter both a date and a time, including the year, month, and day as well as the time in hours and minutes.

```htmlembedded=1
<input type="datetime-local" name="" id="" />
```
---
### 11. [input type hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/hidden)

Let web developers include data that cannot be seen or modified by users when a form is submitted.

```htmlembedded=1
<input type="hidden" name="" id="" />
```
---
### 12. [input type checkbox](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox)

To choose zero or more option from a group of options.

```htmlembedded=1
<input type="checkbox" name="" value="" id="" />
```
---
### 13. [input type radio](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio)

To choose only one option from a group of options.

```htmlembedded=1
<input type="radio" name="" value="" id="" />
```
---
### 14. [input type file](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file)

Let the user choose one or more files from their device storage.

```htmlembedded=1
<input type="file" name="" accept="" />
```
---
### 15. [input type image](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/image)

It is used to create graphical submit button.

```htmlembedded=1
<input type="image" name="" src="" />
```