What is a Button?
A button
on a webpage is an element that encourages user interaction by allowing them to click to perform specific functions.
Buttons can execute a variety of functions.
For example, clicking a login button will log you in, clicking a sign-up button will navigate you to the sign-up page, and clicking a create post button will take you to the page where you can create a post.
Buttons can be placed anywhere on a webpage. They are used so frequently that they are often pre-created for reuse.
Button Example Code - html
<li> <a class="nav-link btn btn-primary" href="#footer" >Contact <i class="fas fa-arrow-right"></i ></a> </li>
Button Example Code - css
.navbar .btn { margin-right: 24px; } .fas.fa-arrow-right { margin-left: 8px; font-size: 14px; } /* Buttons */ .btn { display: inline-block; padding: 12px 32px; border-radius: 30px; text-transform: uppercase; font-size: 14px; transition: 0.3s; } .btn-primary { background: var(--primary-color); color: #000000; } .btn-secondary { margin: 5px 0; background-color: var(--bg-secondary); color: var(--bg-primary); }
Let's go through this code step by step to understand its composition.
Lecture
AI Tutor
Design
Upload
Notes
Favorites
Help