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

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值