1. 程式人生 > >BOOTSTRAP 入門

BOOTSTRAP 入門

Bootstrap 簡介

BootStrap 是Twitter的工程師開發的前端框架,可以非常方便的設計出好看的頁面效果。我的理解就是對常規前端語言的加強,顯示出更炫酷的效果。舉個栗子:
html的按鈕出來的效果(https://img-blog.csdnimg.cn/20181206110008133.png)
BootStrap 的按鈕(https://img-blog.csdnimg.cn/20181206110124676.png)

Bootstrap使用前的準備

步驟 1 :
<!DOCTYPE html>
步驟 2 :
匯入js 匯入css

== 注:順序不要搞錯了,否則有一些效果會出不來。==
首先是JQuery
然後是Bootstrap css
最後是Bootstrap js
步驟 3 : 套用class

<button class="btn btn-success">按鈕</button>

所有程式碼

<!DOCTYPE html>
<script src="http://how2j.cn/study/js/jquery/2.0.0/jquery.min.js"></script>
<link href="http://how2j.cn/study/css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
<script src="http://how2j.cn/study/js/bootstrap/3.3.6/bootstrap.min.js"></script>
 
<button class="btn btn-success">按鈕</button>