英文:
Problem with css in Spring application Thymeleaf
问题
<!DOCTYPE html>
<html lang="en">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Menu</title>
<link href="../static/style.css" th:href="@{/style.css}" rel="stylesheet" />
</head>
<body>
<nav>
<ul>
<li><a href="#"> View</a></li>
<li><a href="#"> Notify </a></li>
<li><a href="#"> A</a></li>
<li><a href="#"> B</a></li>
</ul>
</nav>
</body>
</html>
* {
margin: 0;
padding: 0;
}
ul {
}
ul li {
list-style: none;
display: inline-block;
float: left;
}
ul li a {
text-decoration: none;
font-size: 14px;
font-family: arial;
color: #1e1e1e;
}
项目结构：
尝试多次更改 CSS 文件的根路径，甚至尝试在没有 Thymeleaf 的情况下进行，但仍然无效。任何帮助将不胜感激。HTML 文件可以正常工作，但 CSS 文件未应用于其中。
<details>
<summary>英文:</summary>
I am currently trying to make a webpage but I can't tell why my html can't see the css file provided. I have an application in SpringBoot.
I have the following files:
index.html
<!DOCTYPE html>
<html lang="en">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Menu</title>
<link href="../static/style.css" th:href="@{/style.css}" rel="stylesheet" />
</head>
<body>
<nav>
<ul>
<li><a href="#"> View</a></li>
<li><a href="#"> Notify </a></li>
<li><a href="#"> A</a></li>
<li><a href="#"> B</a></li>
</ul>
</nav>
</body>
</html>
style.css
* {
margin: 0;
padding: 0;
}
ul {
}
ul li {
list-style: none;
display: inline-block;
float: left;
}
ul li a {
text-decoration: none;
font-size:14px;
font-family: arial;
color: #1e1e1e;
}
Structure of project:
[![enter image description here][1]][1]
Tried changing the root to the css file multiple times and tried even without thymeleaf however it doesn't work . Any help would be great. The html file works however the css file is not applied to it.
[1]: https://i.stack.imgur.com/I4frO.png
</details>
# 答案1
**得分**: 0
有多种方法可以解决这个问题。
1. 尝试像下面这样为链接标签指定类型。
type="text/css";
2. 在浏览器开发工具中检查元素，查看它当前正在尝试加载哪个 URL。从中你会得到一个想法，以便你可以修改 CSS 链接的路径。
3. 确保你已经配置了资源处理程序，这样 Spring Boot 就知道从何处精确地搜索静态资源。
参考：https://stackoverflow.com/q/29562471/6572971
<details>
<summary>英文:</summary>
There are multiple ways to troubleshoot this issue.
1. Try specifying type to link tag like below.
type="text/css"
2. Inspect elements in browser developer tool and check for what URL it is trying to load currently. From this you will get idea so that you can modify the css href path.
3. Ensure that you have configured Resource handlers so that spring boot knows where to search for static resources exactly.
Refer : https://stackoverflow.com/q/29562471/6572971
</details>
专注分享java语言的经验与见解，让所有开发者获益！
评论