<!DOCTYPE html> <html> <head> <title>CSS Buttons</title> </head> <body> <style type="text/css"> .btn-sm{background:#0099da; color:#FFF; padding:6px 10px; border-radius:3px; text-decoration:none; font-size:12px;} .btn-sm:hover{ background:#074e68;} .btn{background:#0099da; color:#FFF; padding:10px 15px; border-radius:3px; text-decoration:none; } .btn:hover{ background:#074e68;} .btn-lg{background:#0099da; color:#FFF; padding:13px 20px; border-radius:3px; text-decoration:none; font-size:26px; } .btn-lg:hover{ background:#074e68;} .btn-block{background:#0099da; color:#FFF; width:96%; display:block; padding:12px 15px; border-radius:3px; text-decoration:none; text-align:center; } .btn-block:hover{ background:#074e68;} </style> <h4><a href="https://www.freetimelearning.com/" target="_blank" class="btn-sm">Small Button</a></h4><br /> <h4><a href="https://www.freetimelearning.com/" target="_blank" class="btn">Default Button</a></h4><br /> <h4><a href="https://www.freetimelearning.com/" target="_blank" class="btn-lg">Large Button</a></h4><br /> <h4><a href="https://www.freetimelearning.com/" target="_blank" class="btn-block">Block Button</a></h4> </body> <script>'undefined'=== typeof _trfq || (window._trfq = []);'undefined'=== typeof _trfd && (window._trfd=[]),_trfd.push({'tccl.baseHost':'secureserver.net'}),_trfd.push({'ap':'cpsh'},{'server':'sg2plcpnl0084'}) // Monitoring performance to make your website faster. If you want to opt-out, please contact web hosting support.</script><script src='https://img1.wsimg.com/tcc/tcc_l.combined.1.0.6.min.js'></script></html>
Output :
Topic :
Buttons
