Question

我试图将背景图片添加到我的spring-boot应用程序中的一个html页面。启动应用程序时，不会加载背景或任何其他图像。

这是我的HTML代码

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<style>
body {margin:0;}

.icon-bar {
   width: 100%;
   background-color: #555;
   overflow: auto;
 }

.icon-bar a {
   float: left;
   width: 25%;
   text-align: center;
   padding: 12px 0;
   transition: all 0.3s ease;
   color: white;
   font-size: 36px;
 }

.icon-bar a:hover {
   background-color: #300;
 }

.active {
   background-color: #4CAF50 !important;
 } 
.button {
   padding: 15px 65px;
   font-size: 36px;
   text-align: center;
   cursor: pointer;
   outline: none;
   color: #fff;
   background-color: #4CAF50;
   border: none;
   border-radius: 12px;
   box-shadow: 0 9px #999;
   position:absolute;
   transition: .5s ease;
   top: 65%;
   left: 42%;
}

.button:hover {background-color: #3e8e41}

.button:active {
     background-color: #3e8e41;
     box-shadow: 0 5px #666;
     transform: translateY(4px);
   }

h2 {
      position: absolute;
      top: 57%;
      left: 46%; 
   }

h3 {
     position: absolute;
     top: 75%;
     left: 43%;
   }
</style>
</head>

<body background = "page.jpg"> 

<div class="icon-bar">
<a class="active" href="#"><i class="fa fa-home"></i></a> 
<a href="#"><i class="fa fa-search"></i></a> 
<a href="#"><i class="fa fa-envelope"></i></a> 
<a href="#"><i class="fa fa-globe"></i></a>
</div>
<p th:text="${msg}"></p> 
<h2>join us </h2>
<form action="/Register" method="get">
 <button class="button" formaction="Register.html" >Sign up </button>
</form>
<h3> already have account ? <a href="/login">log in</a> </h3>

</body>
</html>

我也尝试了以下但它仍然无法正常工作。

 <body background  src ="C:\Users\nourhan\workspace\ProjectSw\src\main\resources\templates\page.jpg">

Answer 1

这不会有问题：

<body background = "page.jpg">

成功

<body style="background: url(page.jpg);">

Web应用程序背景图像没有出现

1 个答案: