Spectre Form Textarea

Last Updated : 24 Jan, 2022

The Spectre Forms provide the most common control component used in a regular form. In this article, we will discuss the form textarea. The form textarea is an important component that is required to get the feedback(major cases) from the user as usual.

Form Textarea Class: There is no specific class for the textarea, it is like a normal textarea tag that is required to give the user a text area. You can specify the rows by mentioning the rows number like rows=”number”.

Syntax:

<textarea class="form-input" 
          id="input-example-1" 
          rows="3">
</textarea>

Example:

HTML

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>SPECTRE CSS Forms Class</title> 
    <link rel="stylesheet"
        href= 
"https://unpkg.com/spectre.css/dist/spectre.min.css"> 
    <link rel="stylesheet"
        href= 
"https://unpkg.com/spectre.css/dist/spectre-exp.min.css"> 
    <link rel="stylesheet"
        href= 
"https://unpkg.com/spectre.css/dist/spectre-icons.min.css"> 
</head> 
  
<body> 
    <center> 
        <h1 class="text-success">GeeksforGeeks</h1> 
        <strong>SPECTRE Forms Form Textarea Class</strong> 
        <br> 
    </center> 
    <div class="form-group"> 
        <label class="form-label"> 
            Name 
        </label> 
        <input class="form-input" 
               placeholder="Please type your name"> 
        <label class="form-label"> 
            Mail Id 
        </label> 
        <input class="form-input" 
               placeholder="Your Mail Id"> 
        <label class="form-label"> 
            Feedback 
        </label> 
        <textarea class="form-input" 
                  id="input-example-1" 
                  rows="3"> 
        </textarea> 
        <br> 
        <center> 
            <button class="btn btn-success"> 
              LogIn 
            </button> 
            <button class="btn btn-error"> 
              Sign Up 
            </button> 
        </center> 
    </div> 
      
</body> 
  
</html>