The HTML placeholder attribute provides a short hint or example inside an input field before the user enters a value. It helps users understand the expected type of input.
- Displays hint text inside input or textarea fields.
- Disappears when the user starts typing.
- Improves form usability and user guidance.
- Commonly used with text, email, password, and search fields.
Syntax:
<element placeholder="">HTML placeholder Attribute Examples
Example 1: HTML <input> placeholder attribute specifies a short hint or example text displayed in an input field before the user enters a value. It helps users understand the expected input format or content.
<!DOCTYPE html>
<html>
<body>
<h3>
HTML placeholder Attribute Example
</h3>
<!-- HTML placeholder attribute used in input tag -->
<form action=" ">
<label for="First Name">Enter your first name:</label>
<input type="text" name="fname" placeholder="First name">
<br>
<br>
<label for="First Name">Enter your last name:</label>
<input type="text" name="lname" placeholder="Last name">
<br>
<br>
<input type="submit" value="Submit">
</form>
</body>
</html>
Example 2: HTML <textarea> placeholder attribute is used to specify the expected value to be displayed before user input in textarea element.
<!DOCTYPE html>
<html>
<body>
<h3>
HTML placeholder Attribute Example
</h3>
<!-- HTML placeholder attribute used in textarea tag -->
<textarea rows="4" cols="50"
placeholder="Describe yourself here...">
</textarea>
</body>
</html>