前端框架--bootstrap

   日期:2020-05-17     浏览:92    评论:0    
核心提示:前端框架–bootstrap一:bootstrap是什么?bootstrap是一个集成了css和html的前端框架。能够快速开发web应用程序和网站。二:bootstrap的使用流程1.将bootstrap的js和css相关文件夹导入到webapp目录下,在spring-mvc.xml中放开静态资源 <前端框架

前端框架–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相关的插件,但由于内容较多,小编决定分多个帖子进行讲解。内容有误之处,烦请联系小编进行更改或删除,谢谢!

 
打赏
 本文转载自:网络 
所有权利归属于原作者,如文章来源标示错误或侵犯了您的权利请联系微信13520258486
更多>最近资讯中心
更多>最新资讯中心
更多>相关资讯中心
0相关评论

推荐图文
推荐资讯中心
点击排行
最新信息
新手指南
采购商服务
供应商服务
交易安全
关注我们
手机网站:
新浪微博:
微信关注:

13520258486

周一至周五 9:00-18:00
(其他时间联系在线客服)

24小时在线客服