Bootstrap打包的文件是什么意思

這篇文章主要為大家展示了“Bootstrap打包的文件是什么意思”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“Bootstrap打包的文件是什么意思”這篇文章吧。

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/ <!--字體圖標-->

 ├── glyphicons-halflings-regular.eot

 ├── glyphicons-halflings-regular.svg

 ├── glyphicons-halflings-regular.ttf

 ├── glyphicons-halflings-regular.woff

 └── glyphicons-halflings-regular.woff2

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

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

<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="external nofollow" >
<!-- 可選的Bootstrap主題文件（一般不用引入） -->
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css" rel="external nofollow" >
<!-- jQuery文件，務必在bootstrap.min.js 之前引入 --> 
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="//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網頁的最底部，這么做是為了防止網頁未加載完畢而這兩個文件先加載可能產生的不必要的問題。

關于字體文件的解釋：

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

TrueType

Windows和Mac系統最常用的字體格式，其最大的特點就是它是由一種數學模式來進行定義的基于輪廓技術的字體，這使得它們比基于矢量的字體更容易處理，保證了屏幕與打印輸出的一致性。同時，這類字體和矢量字體一樣可以隨意縮放、旋轉而不必擔心會出現鋸齒。

EOT – Embedded Open Type (.eot)

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

OpenType (.otf)

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

WOFF – Web Open Font Format (.woff)

WOFF（Web開發字體格式）是一種專門為了Web而設計的字體格式標準，實際上是對于TrueType/OpenType等字體格式的封裝，每個字體文件中含有字體以及針對字體的元數據（Metadata），字體文件被壓縮，以便于網絡傳輸。

SVG (Scalable Vector Graphics) Fonts (.svg)

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

以上是“Bootstrap打包的文件是什么意思”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！