在JAVA Web的JSP檔案使用Bootstrap

發現公司系統的專案都是寫原生CSS，開發切版花了很多時間，不如來用一下之前學過的Bootstrap加速一下~
先貼上一段bootstrap的程式碼，還沒成功引入bootstrap的畫面

預期會變成這樣，它是一個可以展開、摺疊的摺頁，這樣就需要引入bootstrap的CSS和JavaScript控制的這兩個部分

最簡單粗暴的-線上導入

在head標籤中加入這串，這樣就能導入css部分的程式碼：

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">		

別忘了還有負責動態效果的JavaScript，

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>

使用下載版本的Bootstrap

1. 先到載點下載CSS以及JS的檔案，這裡下載完會獲得一個壓縮檔
   

2. 在專案的WebContent資料夾裡新建一個Bootstrap資料夾(或是其他名字也可以)，把剛才下載的壓縮檔裡的CSS、JS資料夾塞進去，像這樣(js資料夾的錯誤還沒搞清楚是怎麼一回事，但目前用起來沒什麼問題)
   

3. 和上一種方法相同，將這段程式碼貼在head標籤內，將路徑位置改成資料夾的位置就可以正常使用了

   <link href="Bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"  >
   <script src="Bootstrap/js/bootstrap.min.js"></script>

參考資料

bootstrap-Download
How to Get Started with Bootstrap (UI) & Eclipse
Add Bootstrap to JSP Page