Bootstrap CDN和本地化環(huán)境搭建
一、搭建bootstap環(huán)境
可以用bootstrap的CDN服務(wù),在
<link rel="stylesheet"> <script src="http://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
這個(gè)順序不能改變,因?yàn)閎ootstrap.min.js需要調(diào)用jQuery庫(kù),所以jquery.min.js要先于它。
二、本地化bootstap環(huán)境
有時(shí)候網(wǎng)絡(luò)有點(diǎn)卡,刷新頁(yè)面慢,影響網(wǎng)頁(yè)開(kāi)發(fā)調(diào)式,解決這個(gè)讓人不耐煩的小問(wèn)題的方法是本地化這些庫(kù)。本地化時(shí),也要保持上面的順序。
(1)jquery庫(kù),從官網(wǎng)直接下載下來(lái),放在一個(gè)目錄,例如:存放在項(xiàng)目example中的jquery文件夾,則
<script src="/example/jquery/jquery.min.js"></script>
即可
(2)bootstrap框架則相對(duì)要復(fù)雜一些;因?yàn)橐{(diào)用bootstrap自身提供的按鈕之類(lèi)的,如果僅僅有bootstrap.min.css和bootstrap.min.js,會(huì)導(dǎo)致一些問(wèn)題。例如,明明在代碼當(dāng)中添加了某個(gè)按鈕,但是在網(wǎng)頁(yè)中什么也沒(méi)有,排除寫(xiě)錯(cuò)之類(lèi)的錯(cuò)誤之外。在網(wǎng)頁(yè)中調(diào)用bootstrap的按鈕則需要額外的資源文件,只有把這些添加全了才可以正常使用。就調(diào)用按鈕為例,需要把bootstrap下載,然后找到dict文件夾,把里面的所有文件夾(會(huì)有css,js,fonts)copy到項(xiàng)目example新建文件夾boostrap當(dāng)中。當(dāng)需要使用按鈕時(shí),系統(tǒng)會(huì)自動(dòng)詢查相對(duì)路徑,來(lái)收集所需內(nèi)容。
ps:如果其它的調(diào)用,把整個(gè)文件夾拷貝到項(xiàng)目當(dāng)中,添加外部訪問(wèn)即可。
(三)本地化添加外部資源
例如我想用fondawesome(官網(wǎng),中文網(wǎng))一些資源,除了用最簡(jiǎn)潔方式bootstrapCDN
< link rel="stylesheet">
之外
本地化:
復(fù)制整個(gè) font-awesome 文件夾到您的項(xiàng)目中。
在HTML的 中引用font-awesome.min.css。
<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
以上所述是小編給大家介紹的Bootstrap CDN和本地化環(huán)境搭建,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
JavaScript中的字符串與數(shù)字轉(zhuǎn)換的示例
在JavaScript編程中,掌握字符串與數(shù)字的轉(zhuǎn)換技巧對(duì)處理用戶輸入、數(shù)據(jù)計(jì)算及格式化輸出至關(guān)重要,本文詳細(xì)介紹了多種轉(zhuǎn)換方法,下面就一起來(lái)介紹一下2024-09-09js刷新頁(yè)面location.reload()用法詳解
這篇文章主要介紹了js刷新頁(yè)面location.reload()用法詳解,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12js判斷一個(gè)字符串是以某個(gè)字符串開(kāi)頭的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇js判斷一個(gè)字符串是以某個(gè)字符串開(kāi)頭的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-12-12blob轉(zhuǎn)換成string格式同步調(diào)用問(wèn)題解決分析
這篇文章主要為大家介紹了blob轉(zhuǎn)換成string格式同步調(diào)用問(wèn)題解決分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-05-05Bootstrap打造一個(gè)左側(cè)折疊菜單的系統(tǒng)模板(一)
這篇文章主要介紹了Bootstrap打造一個(gè)左側(cè)折疊菜單的系統(tǒng)模板(一)的相關(guān)資料,需要的朋友可以參考下2016-05-05詳解JavaScript對(duì)Date對(duì)象的操作問(wèn)題(生成一個(gè)倒數(shù)7天的數(shù)組)
最近項(xiàng)目需求要生成一個(gè)倒數(shù)7天的數(shù)組,下面小編把我的實(shí)現(xiàn)思路和代碼整理分享給大家,供大家參考,需要的朋友可以參考下2015-10-10javascript同步Import,同步調(diào)用外部js的方法
javascript同步Import,同步調(diào)用外部js的實(shí)現(xiàn)代碼,測(cè)試確實(shí)可用2008-07-07