bootstrap模板怎麼免費下載

Bootstrap是Twitter推出的一個開源的用於前端開發的工具包，其中包含了豐富的Web元件，根據這些元件，可以快速的搭建一個漂亮、功能完備的網站。

最近通過了Bootstrap中文網學習了其中的一些的用法，深深被他簡易用法，邏輯清晰，優雅界面所吸引。但是透過教程只能簡單地理解其中的基本用法，但對於建立一些商業級的應用還是有一定距離。尤其對於我們這些開發人員來說，我們可能更需要的是獲得更多完整的案例作為參考，建立自己的所需的模板。

網路上有很多基於很多Bootstrap的模板與主題，但是普遍出現的問題是：免費的都是挺簡單的，比較完善的就要收費，而且收費的手續也是比較麻煩的，所以想進一步學習或基於完善模板的二次開發會遇到一些麻煩。

下面我們來看一個比較方便取得這些boostrap主題與模板的方法：

1、進入模板網站，選擇模板進入預覽介面，

進入預覽介面後，按下F12工具列，瀏覽器底部出現開發者工具。點選工具列Resource按鈕，可以看見網站的資料夾Frames以及所需圖片，腳本以及樣式，分別有Fonts,Images,Scripts,Stylesheets四個資料夾。

2、首先我們在電腦資料夾中新建一個網站的資料夾，資料夾下新建css,fonts,img,js資料夾。

3、3、回到瀏覽器，我們對網站的檔案分別採取不同的方式進行下載。

Fonts:滑鼠右鍵文件，選擇open link in new tab，文件就進入了下載的介面了，下載本地新建的網站資料夾下的fonts資料夾下

Images:滑鼠右鍵文件，選擇open link in new tab，文件就進入了查看的頁面了，頁面在下載本地新建的網站資料夾下的img資料夾下

Scripts:滑鼠右鍵文件，選擇Save as…，文件就進入了下載的介面了，下載本地新建的資料夾下的js資料夾下

Stylesheets:跟Scripts基本上一致，將檔案下載到本地新建的網站資料夾下的

至此，網站的檔案基本上已經完成了，下面就可以進行html檔案的下載了。

4、F12關閉瀏覽器的開發者工具，在網頁空白處按Ctrl S(網頁另存為)，選擇僅保存html，並根據網頁域名去文件名，保存在本地新網站資料夾的根目錄。將網站下的所有網頁按照此方法進行下載。

5、按照以上方法基本上可以完整下載這個網站模板了，但是有些時候我們打開本地網站資料夾的網頁檔案時，會發現有些圖片載入不出來或者有些字體顯示不正確，這可能網站的資料夾路徑或名稱不正確。我們需要透過網頁程式碼對資料夾的路徑進行整理。我們重新回到瀏覽器介面，F12開啟開發者工具，透過Elements查看網頁程式碼，透過下圖，我們可以見到，雖然我們的網頁檔案已經下載了，但我們初時創建的js,images,css,fonts資料夾是對應不上網頁的程式碼的，此時我們需要透過將檔案依照網頁的程式碼重新整理資料夾路徑。

6、整理完成後，我們就可以免費取得bootstrap的範本了，趕快試試看吧！

更多Bootstrap相關技術文章，請造訪Bootstrap教學欄位進行學習！想要免費下載bootstrap模板，可存取 bootstrap模板 欄位！

以上是bootstrap模板怎麼免費下載的詳細內容。更多資訊請關注PHP中文網其他相關文章！