關(guān)于Bootstrap打包的文件分別代表什么意思，官網(wǎng)也沒有給出一個明確的解釋，在網(wǎng)上查了一些資料，總價歸納了如下：

bootstrap/    <!--主目錄-->

├── css/ <!--CSS樣式文件-->

│ ├── bootstrap.css <!--Bootstrap核心CSS文件-->

│ ├── bootstrap.css.map <!--source map文件-->

│ ├── bootstrap.min.css <!--Bootstrap核心CSS文件 壓縮版-->

│ ├── bootstrap.min.css.map

│ ├── bootstrap-theme.css <!--可選的Bootstrap主題文件（一般不用引入）-->

│ ├── bootstrap-theme.css.map

│ ├── bootstrap-theme.min.css <!--可選的Bootstrap主題文件（一般不用引入） 壓縮版-->

│ └── bootstrap-theme.min.css.map

├── js/ <!--JavaScript文件-->

│ ├── bootstrap.js <!--Bootstrap核心JavaScript文件-->

│ └── bootstrap.min.js <!--Bootstrap核心JavaScript文件 壓縮版-->

└── fonts/ <!--字體圖標(biāo)-->

 ├── glyphicons-halflings-regular.eot

 ├── glyphicons-halflings-regular.svg

 ├── glyphicons-halflings-regular.ttf

 ├── glyphicons-halflings-regular.woff

 └── glyphicons-halflings-regular.woff2

*bootstrap.css 是完整的bootstrap樣式表，未經(jīng)壓縮過的，可供開發(fā)的時候進(jìn)行調(diào)試用
*bootstrap.min.css 是經(jīng)過壓縮后的bootstrap樣式表，內(nèi)容和bootstrap.css完全一樣，但是把中間不必要的空格之類的東西都刪掉了，所以文件大小會比bootstrap.css小，可以在部署網(wǎng)站的時候引用，如果引用了這個文件，就沒必要引用bootstrap.css了，下面的文件同樣。

bootstrap的環(huán)境至少需要3個文件：bootstrap.min.css、jQuery.min.js、bootstrap.min.js，具體代碼如下：

<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet"  rel="external nofollow" >
<!-- 可選的Bootstrap主題文件（一般不用引入） -->
<link rel="stylesheet"  rel="external nofollow" >
<!-- jQuery文件，務(wù)必在bootstrap.min.js 之前引入 --> 
<script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="http://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

需要注意的是：

bootstrap.min.css、jquery.min.js、bootstrap.min.js這三個文件的引入順序一定不能錯亂，一般把jquery.min.js、bootstrap.min.js這兩個文件放入HTML網(wǎng)頁的最底部，這么做是為了防止網(wǎng)頁未加載完畢而這兩個文件先加載可能產(chǎn)生的不必要的問題。

關(guān)于字體文件的解釋：

而由于網(wǎng)頁中使用的字體類型，也是各瀏覽器對字體類型有不同的支持規(guī)格。 字體格式類型主要有幾個大分類：TrueType、Embedded Open Type 、OpenType、WOFF 、SVG。

TrueType

Windows和Mac系統(tǒng)最常用的字體格式，其最大的特點(diǎn)就是它是由一種數(shù)學(xué)模式來進(jìn)行定義的基于輪廓技術(shù)的字體，這使得它們比基于矢量的字體更容易處理，保證了屏幕與打印輸出的一致性。同時，這類字體和矢量字體一樣可以隨意縮放、旋轉(zhuǎn)而不必?fù)?dān)心會出現(xiàn)鋸齒。

EOT – Embedded Open Type (.eot)

EOT是嵌入式字體，是微軟開發(fā)的技術(shù)。允許OpenType字體用@font-face嵌入到網(wǎng)頁并下載至瀏覽器渲染，存儲在臨時安裝文件夾下。

OpenType (.otf)

OpenType是微軟和Adobe共同開發(fā)的字體，微軟的IE瀏覽器全部采用這種字體。致力于替代TrueType字體。

WOFF – Web Open Font Format (.woff)

WOFF（Web開發(fā)字體格式）是一種專門為了Web而設(shè)計(jì)的字體格式標(biāo)準(zhǔn)，實(shí)際上是對于TrueType/OpenType等字體格式的封裝，每個字體文件中含有字體以及針對字體的元數(shù)據(jù)（Metadata），字體文件被壓縮，以便于網(wǎng)絡(luò)傳輸。

SVG (Scalable Vector Graphics) Fonts (.svg)

SVG是由W3C制定的開放標(biāo)準(zhǔn)的圖形格式。SVG字體就是使用SVG技術(shù)來呈現(xiàn)字體，還有一種gzip壓縮格式的SVG字體。使用方法：使用CSS3的@font-face屬性可以實(shí)現(xiàn)在網(wǎng)頁中嵌入任意字體。 但是IE只支持微軟自有的EOT格式字體，需要用字體轉(zhuǎn)換工具將其轉(zhuǎn)換為EOT格式，其他瀏覽器都不支持這一字體格式，其它瀏覽器可以設(shè)置TTF(TrueType)和OTF(OpenType)兩種字體作為自定義字體。

以上所述是小編給大家介紹的Bootstrap里的文件分別代表什么意思及其引用方法，希望對大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會及時回復(fù)大家的，在此也非常感謝大家對腳本之家網(wǎng)站的支持！

最新評論