bootstrap是一套现成的样式
如何在jsp页面使用bootstrap？
1.先在官网下载用于生产环境的bootstrap版本
https://v3.bootcss.com/getting-started/#download
2.将解压的这三个文件夹复制到项目目录下，我放到了bootstrap文件夹下
3，下载jQuery放到项目目录下
https://www.jq22.com/jquery-info122
4.在jsp页面引用（顺序不能乱）
<%--这个是自适应各种分辨率的屏幕--%>
<meta name="viewport" content="width=device-width, initial-scale=1">
<%--引入 bootstrap.min.css （Bootstrap的样式表文件）--%>
<link href="${APP_PATH}/bootstrap/css/bootstrap.min.css" type="text/css" rel="stylesheet"><script src="${APP_PATH}/jquery/jquery-3.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
${APP_PATH}替换为
${pageContext.request.contextPath}
即自己项目的根路径
完整jsp页面为
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>首页</title>
<%--这个是自适应各种分辨率的屏幕--%>
<meta name="viewport" content="width=device-width, initial-scale=1">
<%--引入 bootstrap.min.css （Bootstrap的样式表文件）--%>
<link href="${APP_PATH}/bootstrap/css/bootstrap.min.css" type="text/css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="panel panel-default">
<div class="panel-heading text-center">
<h2>网站首页</h2>
${APP}
</div>
<div class="panel-body text-center">
<ul class="nav navbar-nav ">
<li><a href="${APP_PATH }/login.htm">登录</a></li>
<li><a href="reg.html">注册</a></li>
</ul>
</div>
</div>
</div>
<script src="${APP_PATH}/jquery/jquery-3.1.1.min.js"></script>
<script src="${APP_PATH}/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
2236
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
