CSS Buttons

Written By:-Avinash Malhotra

Our Website:- Tech Altum

• Home
• About Us
• Training
• Carrer

Now, we will learn how to create These type of buttons using css

1. create a div with class nav
2. Create a ul
3. Create four li inside
4. Write Above Text inside each li.
5. Create a style opening and closing tag inside head
6. Start writing following css inside style tag
7. .nav{ height:60px; width:100%}
8. .nav ul li{ float: left; background: black; width: 149px; height: 50px; font-size: 24px; text-align: center; line-height: 57px; margin-right: 1px;}
9. 
   
10. .nav ul li a{ color: gray; text-decoration:none}
11. .nav ul li:hover{ background:white; }
12. .nav ul li:hover a{color:red; }
13. .nav ul li a:hover{ text-decoration:underline}

Save the web document and run in the browser, you will see button as shown above