【Bootstrap初體驗之匯入模板完成第一個例項】
阿新 • • 發佈：2019-01-28
首先在Bootstrap中文網中找到導航欄，點選元件
可以看到頁面右邊提供了很多元件
我們隨便選一個，點選導航條，下拉可以看到關於例項的程式碼
我們將程式碼複製到webstorm裡，直接新增到<body>標籤中，什麼都不用再加然後點選執行，發現效果是這樣
而我們期待的效果是這樣的：
所以接下來我們就要開始匯入模板了，還是回到Bootstrap的導航首頁，點選起步
一直往下拉，直到看到下圖，將以下程式碼複製到webstorm中（新建一個HTML頁面，將上面原有程式碼刪掉，再貼上以下程式碼）
可以看到，下圖中圈出來的就是最終能呈現效果圖所必需的外掛
在你的webstorm專案裡新建一個資料夾，用來存放外掛
所需要的外掛一部份可以直接在Bootstrap官網上下載
開啟之後將裡面對應的外掛新增到webstorm中你建立的資料夾裡，
然後修改程式碼中外掛的路徑
其中html5shiv 和respond和jquery這三個外掛還需要自己下載好再新增到資料夾中
全都修改好了之後，再把剛才關於導航條的程式碼貼上到這個模板中的<body>標籤中
點選執行
大功告成，可以看出bootstrap的功能非常強大而且簡潔方便，以後實現介面再也不用自己辛苦敲程式碼了！直接複製貼上再修改就能實現想要的效果。