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教程欄目進行學習！

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com