<!DOCTYPE html> <html> <head> <style> .a{ background-color:rgb(26,161,242); padding:15px 20px; color:white; text-decoration:none; } .b{ background-color:rgb(26,161,242); padding:15px 20px; color:white; text-decoration:none; } .b:hover{ box-shadow:3px 3px 3px rgba(180,180,180,0.5); color:white; } .c{ padding:15px 20px; text-decoration:none; border-radius:7px; color:rgba(100,100,100,1); box-shadow:3px 3px 3px rgba(180,180,180,0.6), 3px 3px 3px rgba(150,150,150,0.5) inset; } .c:hover{ background-color:rgba(100,100,100,1); color:white; } .d{ background-color:none; padding:15px 20px; text-decoration:none; border-radius:7px; border:1px solid rgba(100,100,100,1); color:rgba(100,100,100,1); } .d:hover{ background-color:rgba(100,100,100,1); color:white; } </style> </head> <body> <br><br> <a href="" class="a">Test</a> <a href="" class="b">Test1</a> <a href="" class="c">Test2</a> <a href="" class="d">Test3</a> </body> </html>
Run
×
Share