當前位置:首頁 » 編程軟體 » jquery編譯

jquery編譯

發布時間: 2024-12-26 06:04:35

Ⅰ 如何使用Bootstrap

方法/步驟

到bootstrap官方網站下載,對於我們開發者來說,直接下載編譯壓縮後的CSS、javaScript文件,另外還包含字體文件,但是不包含文檔和源碼文件。打開解壓包之後可以發現包含三個文件夾 css、fonts、js。這是最基本的Bootstrap組織形式:未壓縮版的文件可以在任意web項目中直接使用。我們提供了壓縮(bootstrap.min.*)與未壓縮 (bootstrap.*)的CSS和JS文件。字體圖標文件來自於Glyphicons

所有Bootstrap插件都依賴jQuery。而且在正式的項目當中我們推薦使用壓縮之後的版本,因為它的體積很小,到官網下載jQuery支持,如圖:

將下載後的就jQuery放到bootstrap中的js目錄下,如圖:

在bootstrap的根目錄下新建一個demo.html文件,(注意,必須在根目錄下面新建,因為後面的步驟中要將bootstrap框架中的css和js文件鏈接到創建的demo中)

編輯demo.html文件,添加對bootstrap框架中css和js的引用,內容如下,圖片有注釋說明,這樣,我們就基本上建立了對bootstrap框架的基本使用架構

源碼:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- viewport的<meta>標簽,這個標簽可以修改在大部分的移動設備上面的顯示,為了確保適當的繪制和觸屏縮放。-->
<title>無標題文檔</title>
<!--樣式文件引用-->
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]
IE9以下的瀏覽器並不支持這些標簽,也不能為這些標簽進行添加樣式。那麼修復這個問題我們需要鏈接引用的文件
意思就是說如果用戶IE瀏覽器的版本小於IE9,那麼就會載入這兩個js文件庫,現在就可以使用這些新的標簽,並且可以在這些標簽上添加樣式了
-->
</head>

<body>
<!--JavaScript插件都是依賴與jQuery庫-->
<script type="text/javascript" src="js/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>

</body>
</html>
另外,bootstrap官方提供了鏈接服務,永久免費,即使你不下載bootstrap框架文件到本地,也可以直接在html中使用,使用下面這段代碼:
<link href="http://libs..com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs..com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs..com/bootstrap/3.0.3/js/bootstrap.min.js"></script>

熱點內容
攪拌站源碼 發布:2024-12-26 18:29:49 瀏覽:983
gzipc語言 發布:2024-12-26 18:17:54 瀏覽:906
我的世界pe神奇寶貝伺服器 發布:2024-12-26 18:16:40 瀏覽:690
埠開放腳本 發布:2024-12-26 18:11:23 瀏覽:157
安卓樣式是什麼 發布:2024-12-26 18:10:49 瀏覽:425
給出資料庫物理存儲結構的方法是 發布:2024-12-26 17:58:40 瀏覽:929
安卓電力公司在哪裡注冊 發布:2024-12-26 17:58:39 瀏覽:995
java調用jar 發布:2024-12-26 17:51:00 瀏覽:75
騰訊通忘記密碼怎麼辦 發布:2024-12-26 17:41:02 瀏覽:197
30歲php 發布:2024-12-26 17:35:53 瀏覽:195