Buttons are one of the most common UI elements. It is used for users to interact with a system and take action by making selections. Pure CSS Active Buttons are used to create an active button that works when the user clicks on the button. The button can be created using <a> and <button> tags.
Pure CSS Active Buttons Class:
- pure-button-active: This class is used to create an active button. This class is used along with the “pure-button” class.
Syntax:
-
Create an active button using <a> Tag:
<a class="pure-button pure-button-active" href="#">
Active Button
</a>
-
Create an active button using <button> tag:
<button class="pure-button pure-button-active">
Active Button
</button>
Example:
HTML
<!DOCTYPE html>
< html >
< head >
< link rel = "stylesheet" href =
integrity =
"sha384-Uu6IeWbM+gzNVXJcM9XV3SohHtmWE+3VGi496jvgX1jyvDTXfdK+rfZc8C1Aehk5"
crossorigin = "anonymous" >
</ head >
< body style = "text-align: center" >
< h1 style = "color: green;" >
GeeksforGeeks
</ h1 >
< h3 >Pure CSS Active Buttons</ h3 >
< button class = "pure-button pure-button-active" >
Active Button 1
</ button >
< a class = "pure-button pure-button-active" href = "" >
Active Button 2
</ a >
</ body >
</ html >
|
Output:
Pure CSS Active Buttons
Reference: https://purecss.io/buttons/#active-buttons
Last Updated :
30 Jan, 2022
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...