前端框架--bootstrap

前端框架–bootstrap

一：bootstrap是什麼？
bootstrap是一個集成了css和html的前端框架。能夠快速開發web應用程序和網站。
二：bootstrap的使用流程
1.將bootstrap的js和css相關文件夾導入到webapp目錄下，在spring-mvc.xml中放開靜態資源

<!-- 放開靜態資源 -->
	<!--location 配置靜態資源的路徑    mapping  /** 代表/bootstrap/路徑下所有的請求都放開-->
	<!-- 爲什麼配置兩顆星？ 
	第一個*：bootstrap文件夾下的所有文件  
	第二個* ：bootstrap文件夾下的所有文件和文件夾
	
	-->
	<mvc:resources location="/bootstrap/" mapping="/bootstrap/**"></mvc:resources>
	<mvc:resources location="/js/" mapping="/js/**"></mvc:resources>
	<mvc:resources location="/images/" mapping="/images/**"></mvc:resources>

2.在前端HTML中使用link及script標籤將js和css引入到jsp頁面。（路徑需要自定義更改）

<!-- 引入bootstrap css文件 -->
<link href="<%=request.getContextPath()%>/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link href="<%=request.getContextPath()%>/bootstrap/css/bootstrap.dropdown.hack.css" rel="stylesheet" />
<!-- 引入bootstrap js文件 -->
<script src="<%=request.getContextPath()%>/bootstrap/js/jquery-3.3.1.min.js"></script>
<script src="<%=request.getContextPath()%>/bootstrap/js/bootstrap.min.js"></script>

<!-- 引入bootbox相關js -->
<script src="<%=request.getContextPath()%>/js/bootbox/bootbox.locales.min.js" type="text/javascript"></script>
<script src="<%=request.getContextPath()%>/js/bootbox/bootbox.min.js" type="text/javascript"></script>

寫在最後

通過上述操作就能簡單快捷的使用絢麗的jsp頁面元素。本來在本帖要繼續介紹與bootstrap相關的插件，但由於內容較多，小編決定分多個帖子進行講解。內容有誤之處，煩請聯繫小編進行更改或刪除，謝謝！