Spring Boot 整合 Thymeleaf 模板 - 第004章 - 增加页面样式/脚本支持

视频课程地址: Spring Boot 整合 Thymeleaf 模板

  • 默认情况下,Spring Boot从classpath下一个叫/static(/public,/resources或/META-INF/resources)的文件夹或从ServletContext根目录提供静态内容。这使用了Spring MVC的ResourceHttpRequestHandler,所以你可以通过添加自己的WebMvcConfigurerAdapter并覆写addResourceHandlers方法来改变这个行为(加载静态文件)

  • 在 resources 目录下新建 static 目录, 并创建 style.css 样式表

.login-title {
    font-size: 30px;
}
  • 在页面中引入 css 样式表

<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>SpringBoot Thymeleaf Integrationtitle>
    <link rel="stylesheet" href="/style.css" />
head>
<body>

<h1>SpringBoot Thymeleaf Integrationh1>

<h2>h2 titleh2>

<span class="login-title">我是引用的样式span>

body>
html>
  • 在 static 目录下创建 home.js 脚本文件
alert(1);
  • 在页面中引入脚本文件

<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>SpringBoot Thymeleaf Integrationtitle>
    <link rel="stylesheet" href="/style.css" />
head>
<body>

<h1>SpringBoot Thymeleaf Integrationh1>

<h2>h2 titleh2>

<span class="login-title">我是引用的样式span>

body>
<script src="/home.js">script>
html>

你可能感兴趣的:(Spring,Boot,Spring中文网)