How to set HTML placeholder Attribute - HTML Input Attributes

The input placeholder attribute specifies a short hint that describes the expected value of an input field (a sample value or a short description of the expected format).

The short hint is displayed in the input field before the user enters a value.

The placeholder attribute works with the following input types: text, search, url, tel, email, and password.

How is to look HTML placeholder Attribute

An input field with a placeholder text:

index.html

Example: HTML

 <form>
  <label for="phone">Enter a phone number:</label>
  <input type="tel" id="phone" name="phone"
  placeholder="123-45-678"
  pattern="[0-9]{3}-[0-9]{2}-[0-9]{3}">
</form>

Output should be:

Full Code Example of HTML placeholder Attribute

The input placeholder attribute The placeholder attribute specifies a short hint that describes the expected value of an input field.

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h1>The input placeholder attribute</h1>

<p>The placeholder attribute specifies a short hint that describes the expected value of an input field.</p>

<form action="/action_page.php">
  <label for="phone">Enter a phone number:</label>
  <input type="tel" id="phone" name="phone" placeholder="123-45-678" pattern="[0-9]{3}-[0-9]{2}-[0-9]{3}"><br><br>
  <input type="submit" value="Submit">
</form>

</body>
</html>

Output should be:

Category:	Web Tutorial
Sub Category:	HTML Input Attributes
Uploaded by:	Admin

Read Article
https://develop.horje.com/learn/1434/reference