Computer scienceFrontendHTMLForms

Input types

Theory

Apply input types

Report a typo

In the HTML code below, apply the relevant input types to the form.

Write HTML and CSS code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Input Types</title>
</head>
<body>
<form action="">
<label for="name">Name:</label><br />
<input id="name" name="name" /><br />
<label for="email">Email:</label><br />
<input name="email" id="email" /><br />

<label for="username">Username:</label><br />
<input type="text" name="username" id="username" /><br />
<label for="password">Password:</label><br />
<input type="password" name="password" id="password" /><br />

<label for="date">Date:</label><br />
<input name="date" id="date" /><br />

<label for="contact">Contact no. :</label><br />
<input
type="tel"
name="contact"
id="contact"
pattern="[0-9]{4}-[0-9]{3}-[0-9]{3}"/><br />
<hr />
<input type="submit" value="submit" />
</form>
</body>
</html>

Completed 2 of 5
Add type attribute to the name field with the relevant value.
Add type attribute to the email field with the relevant value.
___

Create a free account to access the full topic