Skip to content
Related Articles

Related Articles

Improve Article
HTML | placeholder Attribute
  • Difficulty Level : Basic
  • Last Updated : 03 Mar, 2021

The 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="">

Elements: This method can have following attributes:

  • <input>
  • <textarea>

Attribute: The attribute for each of the above element is placeholder.

Example: With <input> element






<!DOCTYPE html>
<html>
  
<body>
    <center>
        <h1 style="font-size:25px;font-style:italic;">
            GeeksforGeeks
        </h1>
        <h2 style="font-size:25px;font-style:italic;">
          Placeholder Attribute in Input Element
        </h2>
        <form action=" ">
            <input type="text" name="fname" 
                             placeholder="First name">
            <br>
            <input type="text" name="lname" 
                              placeholder="Last name">
            <br>
            <input type="submit" value="Submit">
        </form>
  </center>
</body>
  
</html>

Output:

Example: With <textarea> element




<!DOCTYPE html>
<html>
  
<body>
    <center>
        <h1 style="font-size:25px;font-style:italic;">
          GeeksForGeeks
        </h1>
        <h2 style="font-size:25px;font-style:italic;">
          Placeholder Attribute in Textarea Element
        </h2
        Give your Intro:
        <textarea rows="4" cols="40" 
          placeholder="Write something here about yourself...">
        </textarea>
  </center>
</body>
  
</html>

Output:

Supported Browsers: The browser supported by placeholder Attribute are listed below:

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Opera
  • Safari



My Personal Notes arrow_drop_up
Recommended Articles
Page :