Question

我在Bootstrap 4中遇到问题：样式未加载到页面中。我正在使用Spring Boot，Maven和THymeleaf。

我的HTML文件中有

<link rel="stylesheet" type="text/css" th:href="@{/webjars/bootstrap/4.0.0-beta.2/css/bootstrap.min.css}" />

我也有Maven依赖项

<dependency>
        <groupId>org.webjars</groupId>
        <artifactId>bootstrap</artifactId>
        <version>4.3.1</version>
</dependency>

例如，当我尝试添加引导卡或按钮时，我会以基本的html样式看到它们。那我有什么问题谢谢你的帮助

Answer 1

这是您可以在pom.xml文件中添加这些依赖项的方法

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>bootstrap</artifactId>
    <version>4.0.0-2</version>
</dependency>

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>webjars-locator</artifactId>
    <version>0.30</version>
</dependency>

使用Spring Framework version 4.2 or higher时，它将自动检测类路径上的webjars-locator库，并使用它来自动解析任何WebJars资产的版本。只需在您的视图页面标签中添加

<link rel="stylesheet" th:href="@{/webjars/bootstrap/css/bootstrap.min.css}">

还要在您的<body></body>标签的底部添加

<script th:src="@{/webjars/jquery/jquery.min.js}"></script>
<script th:src="@{/webjars/popper.js/umd/popper.min.js}"></script>
<script th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>

希望您现在处于引导状态。编码愉快。

为了更好地理解我所说的内容-https://www.baeldung.com/maven-webjars

Answer 2

尝试（类似于）：

<link rel="stylesheet"
        th:href="@{webjars/bootstrap/4.3.1/css/bootstrap.min.css}" />

注意事项：

引导程序的版本。您的html版本与pom版本不同。
您必须在花括号内使用“ webjars / ...”，而不要使用“ / webjars / ...”。删除前导斜杠（/)。

看看示例here。

Bootstrap 4样式未与百里香叶弹簧靴配合使用

2 个答案: