Pure CSS Primary Buttons
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 Primary Button is used to create a primary action button. The primary button is created using Pure CSS class.
Pure CSS Primary Buttons Class:
- pure-button-primary: This class is used to create the primary action button. his class is used alongside “pure-button” class.
Syntax:
Create a Primary Button using <a> Tag:
<a class="pure-button pure-button-primary" href="#"> Primary Button </a>
Create a Primary Button using <button> Tag:
<button class="pure-button pure-button-primary"> Primary 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 Primary Buttons</h3> <!-- Primary button using a tag --> <a class="pure-button pure-button-primary" href="#"> Primary Button 1 </a> <!-- Primary button using button tag --> <button class="pure-button pure-button-primary"> Primary Button 2 </button></body> </html> |
Output:
Pure CSS Primary Buttons
Reference: https://purecss.io/buttons/#primary-buttons
Please Login to comment...