bootstrap-表單控件——按鈕
1.運行效果如圖所示
2.實現代碼以下
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>表單控件——按鈕</title> <!-- 最新版本的 Bootstrap 核心 CSS 文件 --> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <!-- 可選的 Bootstrap 主題文件（通常不用引入） --> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> </head> <body> <form role="form"> <div class="form-group"> <button class="btn" type="button">基礎按鈕.btn</button> <button class="btn btn-default" type="button">默認按鈕.btn-default</button> <button class="btn btn-primary" type="button">主要按鈕.btn-primary</button> <button class="btn btn-success" type="button">成功按鈕.btn-success</button> <button class="btn btn-info" type="button">信息按鈕.btn-info</button> <button class="btn btn-warning" type="button">警告按鈕.btn-warning</button> <button class="btn btn-danger" type="button">危險按鈕.btn-danger</button> <button class="btn btn-link" type="button">連接按鈕.btn-link</button> </div> </form> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> </body> </html>
相關文章
- 1. bootstrap-表單控件——塊狀按鈕
- 2. bootstrap-switch開關按鈕表單插件
- 3. bootstrap-表單控件——單選按鈕水平排列
- 4. bootstrap-表單控件——複選框checkbox和單選擇按鈕radio
- 5. Bootstrap CSS 表單、按鈕和圖片
- 6. Bootstrap 按鈕下拉菜單
- 7. Bootstrap-菜單，導航，按鈕
- 8. bootstrap圖標菜單按鈕組件
- 9. Bootstrap 按鈕
- 10. Bootstrap 按鈕組
- 更多相關文章...
- • jQuery Mobile 按鈕 - jQuery Mobile 教程
- • ionic 按鈕 - ionic 教程
- • TiDB 在摩拜單車在線數據業務的應用和實踐
- • IntelliJ IDEA安裝代碼格式化插件
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
