HTML placeholder Attribute
HTML placeholder attribute specifies a short hint that describes the expected value of an input field/text area. The short hint is displayed in the field before the user enters a value.
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.
HTML
<!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 > |
Output: In this example, we demonstrate placeholder attributes in input elements. Two text input fields for first and last names. Placeholder text guides user input, improving form usability.
Example 2: HTML <textarea> placeholder attribute is used to specify the expected value to be displayed before user input in textarea element.
HTML
<!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 > |
Output: In this example we demonstrates placeholder attribute in textarea elements. We have a text area with in which user can write their introduction
HTML placeholder Attribute Related Questions
Here the placeholder attribute is used to define a hint of what value has to be entered on the input and textarea field.
To align we can use text-align property to set the text alignment in the placeholder.
The placeholder attribute and the <label> serve different purposes in providing hints and information for form fields.
Supported Browsers:
Contact Us