Skip to content
Related Articles
Get the best out of our app
GeeksforGeeks App
Open App
geeksforgeeks
Browser
Continue

Related Articles

Spectre Button States

Improve Article
Save Article
Like Article
Improve Article
Save Article
Like Article

The button is an important feature of any website or in any app. The Spectre Button state class is used to define the states of the button. 

Button States Class:

  • active: This class is used to show that the button is active which is the default.
  • disabled: This class is used to show that the button is disabled.
  • loading: This class is used to show that the button is loading.

Example: The below example illustrate the Button States in Spectre.

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>SPECTRE CSS Buttons Class</title>
    <link rel="stylesheet" 
          href=
    <link rel="stylesheet" 
          href=
    <link rel="stylesheet" 
          href=
</head>
  
<body>
    <center>
        <h1>GeeksforGeeks</h1
        <strong>SPECTRE Button States Class</strong>
        <br>
        <button class="btn btn-primary active">
          Active Button
        </button>
        <button class="btn btn-success disabled">
          Disable Button
        </button>
        <button class="btn btn-error loading">
          Loading Button
        </button>
    </center>
</body>
  
</html>

Output:

Reference: https://picturepan2.github.io/spectre/elements/buttons.html#buttons-states


My Personal Notes arrow_drop_up
Last Updated : 14 Dec, 2021
Like Article
Save Article
Similar Reads
Related Tutorials