css通用button的設定
阿新 • • 發佈:2018-12-07
前端開發通用樣式中的button
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>通用button設定</title> <style type="text/css"> /*btn是大按鈕,btn-min是小按鈕*/ .btn{ display: inline-block; height: 45px; line-height: 45px; background: #c60023; font-size: 17px; color: #fff; cursor: pointer; text-decoration: none; outline: none; font-weight: bold; padding: 0 20px; vertical-align: middle; border: none; } .btn-min{ font-size: 10px; height: 30px; line-height: 30px; } </style> </head> <body> <div class = "btn">按鈕1</div> <div class="btn btn-min">按鈕2</div> </body> </html>
效果如圖: