Bootstrap,來自 Twitter,是目前最受歡迎的前端框架。Bootstrap 是基於 HTML、CSS、JAVASCRIPT 的,它簡潔靈活,使得 Web 開發更加快捷。
Bootstrap 安裝是非常容易的。下面將講解如何下載並安裝 Bootstrap,討論 Bootstrap 文件結構,並通過一個實例演示它的用法。
您可以從 http://getbootstrap.com/ 上下載 Bootstrap 的最新版本。當您點擊這個鏈接時,您將看到如下所示的網頁:
點擊Download Bootstrap
您會看到兩個按鈕:
由於文件是被編譯過和壓縮過的,在獨立的功能開發中,您不必每次都包含這些獨立的文件。
當您下載了 Bootstrap 的已編譯的版本,解壓縮 ZIP 文件,您將看到下面的文件/目錄結構:
如果您下載了 Bootstrap 源代碼,那麼文件結構將如下所示:
直接在eclipse中新建一個web project,將壓縮後的文件複製到WebContent下面,再新建一個hello.html.
hello.html裏面代碼爲:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic Bootstrap Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css">
</head>
<body>
<h1>Hello, world!</h1>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
</body>
</html>
運行結果爲
就OK啦