java—如何使用SpringMVC实现引导？

gdrx4gfi 于 2021-07-13 发布在 Java

关注(0)|答案(1)|浏览(418)

我在bootstrap studio中创建了bootstrap html文件；结构如下：

然后我将所有这些文件移到spring项目端的webinf/view文件夹中，并将它们更改为jsp格式。
我有一个控制器localhost:8080/greeting'指向index.jsp的url'
页面的外观如下：

实际上是这样的：

老实说，我不知道如何在我的spring项目中包含bootstrap，所以我不要求向我解释所有的事情，但是我很希望有人能给我一些建议如何让它工作。
下面是我的greeting.jsp文件：

<!DOCTYPE html>
<html style="background: #000514;">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>Dashboard - Logiweb Brand</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i">
    <link rel="stylesheet" href="assets/fonts/fontawesome-all.min.css">
    <link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
    <link rel="stylesheet" href="assets/fonts/fontawesome5-overrides.min.css">
</head>
<body id="page-top" style="background: rgb(0,0,0);">
    <div id="wrapper">
        <div class="d-flex flex-column" id="content-wrapper" style="background: #000514;">
            <div class="text-break text-left" id="content" style="background: #000514;"></div>
        </div><a class="border rounded d-inline scroll-to-top" href="#page-top"><i class="fas fa-angle-up"></i></a>
    </div>
    <nav class="navbar navbar-light navbar-expand-md" style="color: var(--pink);background: #d70884;">
        <div class="container-fluid"><a class="navbar-brand" href="#">Brand</a><button data-toggle="collapse" class="navbar-toggler" data-target="#navcol-1"><span class="sr-only">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
            <div class="collapse navbar-collapse" id="navcol-1">
                <ul class="navbar-nav">
                    <li class="nav-item"><a class="nav-link active" href="#">First Item</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">Second Item</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">Third Item</a></li>
                </ul>
            </div>
            <div class="dropdown"><a class="dropdown-toggle" aria-expanded="false" data-toggle="dropdown" href="#" style="color: rgb(0,0,0);">Dropdown </a>
                <div class="dropdown-menu"><a class="dropdown-item" href="#">First Item</a><a class="dropdown-item" href="#">Second Item</a><a class="dropdown-item" href="#">Third Item</a></div>
            </div>
        </div>
    </nav>
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.js"></script>
    <script src="assets/js/theme.js"></script>
</body>
</html>

Java spring spring-mvc bootstrap-4

来源：https://stackoverflow.com/questions/67106117/how-to-make-bootstrap-work-with-spring-mvc

1条答案

按热度按时间

jaql4c8m1#

我通过在link标签的href属性中使用jsp标签解决了这个问题。所以我改变了以下内容：

<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">

收件人：

<link rel="stylesheet" href="<c:url value="assets/bootstrap/css/bootstrap.min.css"/>">

因此，答案中的完整代码应如下所示：

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html style="background: #000514;">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>Dashboard - Logiweb Brand</title>
    <link rel="stylesheet" href="<c:url value="assets/bootstrap/css/bootstrap.min.css"/>">
    <link rel="stylesheet" href="<c:url value="assets/fonts/fontawesome-all.min.css"/>">
    <link rel="stylesheet" href="<c:url value="assets/fonts/font-awesome.min.css"/>">
    <link rel="stylesheet" href="<c:url value="assets/fonts/fontawesome5-overrides.min.css"/>">
</head>
<body id="page-top" style="background: rgb(0,0,0);">
    <div id="wrapper">
        <div class="d-flex flex-column" id="content-wrapper" style="background: #000514;">
            <div class="text-break text-left" id="content" style="background: #000514;"></div>
        </div><a class="border rounded d-inline scroll-to-top" href="#page-top"><i class="fas fa-angle-up"></i></a>
    </div>
    <nav class="navbar navbar-light navbar-expand-md" style="color: var(--pink);background: #d70884;">
        <div class="container-fluid"><a class="navbar-brand" href="#">Brand</a><button data-toggle="collapse" class="navbar-toggler" data-target="#navcol-1"><span class="sr-only">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
            <div class="collapse navbar-collapse" id="navcol-1">
                <ul class="navbar-nav">
                    <li class="nav-item"><a class="nav-link active" href="#">First Item</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">Second Item</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">Third Item</a></li>
                </ul>
            </div>
            <div class="dropdown"><a class="dropdown-toggle" aria-expanded="false" data-toggle="dropdown" href="#" style="color: rgb(0,0,0);">Dropdown </a>
                <div class="dropdown-menu"><a class="dropdown-item" href="#">First Item</a><a class="dropdown-item" href="#">Second Item</a><a class="dropdown-item" href="#">Third Item</a></div>
            </div>
        </div>
    </nav>
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.js"></script>
    <script src="assets/js/theme.js"></script>
</body>
</html>

展开查看全部

赞(0）回复(0）举报 2021-07-13

我来回答

java—如何使用SpringMVC实现引导？

1条答案

相关问题

热门标签

最新问答