:::
2. 相關資源網站
3. 製作基本頁面
- 建立一個專案目錄，例如：bs4
- 先下載最新版 bootstrap4：http://bootstrap.hexschool.com/docs/4.0/getting-started/download/
- 下載後，解壓縮到專案目錄中，會得到 js 及 css 兩個資料夾。
- 由於BootStrap4拿掉了圖示，所以，我們可以直接到 http://fontawesome.io/ 下載，解壓後，將 fonts 及 css 複製到 bs4 裡面。
- 接著下載 jquery：https://jquery.com/download/，並存入 js 資料夾中
- 最後下載popper.js ：https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js，存入 js 資料夾中
- 建立新檔 index.html，內容如下：
<!DOCTYPE html> <html lang="zh-Hant-TW"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <!-- Bootstrap CSS --> <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/font-awesome.min.css"> <link rel="stylesheet" href="css/my.css"> </head> <body> <h1>Hello, world!</h1> <!-- Optional JavaScript --> <!-- jQuery first, then Popper.js, then Bootstrap JS --> <script src="js/jquery-3.2.1.min.js"></script> <script src="js/popper.min.js"></script> <script src="js/bootstrap.min.js"></script> </body> </html> width=device-width：表示寬度是設備螢幕的寬度initial-scale=1：表示初始的縮放比例， 可以讓網頁的寬度自動適應手機螢幕的寬度- 但蘋果在iOS9更新中更改了initial-scale 的用途，故使用
shrink-to-fit=no來替代，以讓網頁的寬度自動適應手機螢幕的寬度 - 其中的 css/my.css 是用來放置自己定義的CSS 內容，例如想要讓頁面改用微軟正黑體，只要在裡面加入字型設定即可：
body{ font-family: '微軟正黑體'; } - 下方的JS引入順序請勿隨意調整。
- 詳情：http://bootstrap.hexschool.com/docs/4.0/getting-started/introduction/
