How TO - Alert Buttons Code August 22, 2017 | 1 Comment | CSS Buttons Code <!DOCTYPE html> <html> <head> <style> .btn { border: none; color: white; padding: 14px 28px; font-size: 16px; cursor: pointer; } .success {background-color: #4CAF50;} /* Green */ .success:hover {background-color: #46a049;} .info {background-color: #2196F3;} /* Blue */ .info:hover {background: #0b7dda;} .warning {background-color: #ff9800;} /* Orange */ .warning:hover {background: #e68a00;} .danger {background-color: #f44336;} /* Red */ .danger:hover {background: #da190b;} .default {background-color: #e7e7e7; color: black;} /* Gray */ .default:hover {background: #ddd;} </style> </head> <body> <h1> Alert Buttons</h1> <button class="btn success">Success</button> <button class="btn info">Info</button> <button class="btn warning">Warning</button> <button class="btn danger">Danger</button> <button class="btn default">Default</button> </body> </html> See Will Result Alert Buttons Success Info Warning Danger Default Share This: Facebook Twitter Google+ Stumble Digg CSS Tutorial, HTML and CSS
Nice post, thanks for sharing with us…
ReplyDeleteEcommerce Website Design In Bangalore | Bangalore Ecommerce Development Company | Magento Website Development Company In Bangalore | Ecommerce Website Company In Bangalore