登录&注册

2022-05-13 00:43:04 +08:00
parent 4eadfe16f3
commit a3df75bd66
27 changed files with 255 additions and 120 deletions
--- a/src/main/java/com/quinn/intergration/SendBMail.java
+++ b/src/main/java/com/quinn/intergration/SendBMail.java
@@ -0,0 +1,56 @@
+package com.quinn.intergration;
+
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+import javax.mail.Authenticator;
+import javax.mail.Message;
+import javax.mail.PasswordAuthentication;
+import javax.mail.Session;
+import javax.mail.Transport;
+import javax.mail.internet.InternetAddress;
+import javax.mail.internet.MimeMessage;
+import java.util.Properties;
+
+/**
+ * 使用@multiavatar生成头像
+ * https://api.multiavatar.com/
+ */
+public enum SendBMail {
+
+    INSTANCE;
+    private static final Logger log = LoggerFactory.getLogger(SendBMail.class);
+    final String username = "quinn.admin@88.com";
+    final String password = "Y3YYd4hcY2fFB9VY";
+    boolean isSSL = true;
+    String host = "smtp.88.com";
+    int port = 465;
+    boolean isAuth = true;
+    String from = "quinn.admin@88.com";
+
+    public boolean sendMail(String registerCode,String toEmail){
+        Properties props = new Properties();
+        props.put("mail.smtp.ssl.enable", isSSL);
+        props.put("mail.smtp.host", host);
+        props.put("mail.smtp.port", port);
+        props.put("mail.smtp.auth", isAuth);
+        Session session = Session.getDefaultInstance(props, new Authenticator() {
+            @Override
+            protected PasswordAuthentication getPasswordAuthentication() {
+                return new PasswordAuthentication(username, password);
+            }
+        });
+        try {
+            Message message = new MimeMessage(session);
+            message.setFrom(new InternetAddress(from));
+            message.setSubject("");
+            message.setContent("","text/html;charset=UTF-8");
+            message.addRecipient(Message.RecipientType.TO, new InternetAddress(toEmail));
+            Transport.send(message);
+        } catch (Exception e) {
+            log.error("发送邮件失败",e);
+            return false;
+        }
+        return true;
+    }
+
+}
--- a/src/main/resources/static/css/backgroud.css
+++ b/src/main/resources/static/css/backgroud.css
@@ -0,0 +1,17 @@
+body {
+    background: url(/images/menu/login.png) no-repeat;
+    background-size: 100% 100%;
+    background-attachment: fixed;
+}
+
+main {
+    opacity: 0.9;
+}
+
+#login_box {
+    padding: 35px;
+    border-radius: 15px; /*div圆角*/
+    background: #56666B;
+    color: white;
+    opacity: 0.9;
+}
--- a/src/main/resources/static/css/login.css
+++ b/src/main/resources/static/css/login.css
@@ -1,44 +0,0 @@
-html,
-body {
-    height: 100%;
-}
-
-body {
-    display: -ms-flexbox;
-    display: flex;
-    -ms-flex-align: center;
-    align-items: center;
-    padding-top: 40px;
-    padding-bottom: 40px;
-    background-color: #f5f5f5;
-}
-
-.form-signin {
-    width: 100%;
-    max-width: 330px;
-    padding: 15px;
-    margin: auto;
-}
-.form-signin .checkbox {
-    font-weight: 400;
-}
-.form-signin .form-control {
-    position: relative;
-    box-sizing: border-box;
-    height: auto;
-    padding: 10px;
-    font-size: 16px;
-}
-.form-signin .form-control:focus {
-    z-index: 2;
-}
-.form-signin input[type="email"] {
-    margin-bottom: -1px;
-    border-bottom-right-radius: 0;
-    border-bottom-left-radius: 0;
-}
-.form-signin input[type="password"] {
-    margin-bottom: 10px;
-    border-top-left-radius: 0;
-    border-top-right-radius: 0;
-}
--- a/src/main/resources/static/images/menu/login.png
+++ b/src/main/resources/static/images/menu/login.png
--- a/src/main/resources/templates/blog/editor.html
+++ b/src/main/resources/templates/blog/editor.html
@@ -6,7 +6,7 @@
    <title>论坛-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/wangedit/css/wang.style.css}"/>
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        .nav-underline .nav-link {
            padding-top: .75rem;
@@ -16,11 +16,10 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <!-- 导航栏 -->
 <div th:replace="~{common/header::header(activeUrl='blog')}"></div>
-
 <main role="main" class="container mt-3 p-3 bg-white rounded">
    <div class="row">
        <div class="col-md-12 blog-main">
--- a/src/main/resources/templates/blog/list.html
+++ b/src/main/resources/templates/blog/list.html
@@ -5,6 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>论坛-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 <style>
    #maxLength {
        max-width: 500px;
@@ -14,10 +15,9 @@
    }
 </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <div th:replace="~{common/header::header(activeUrl='blog')}"></div>
-
 <main role="main" class="container">
    <div class="row">
        <div class="col-md-9 blog-main">
@@ -128,7 +128,6 @@

 </main>

-
 <div th:replace="~{common/footer::footer}"></div>

 <a class="to-top badge badge-light">返回顶部</a>
--- a/src/main/resources/templates/blog/read.html
+++ b/src/main/resources/templates/blog/read.html
@@ -6,7 +6,7 @@
    <title>论坛-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/wangedit/css/wang.style.css}"/>
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        .nav-underline .nav-link {
            padding-top: .75rem;
@@ -16,11 +16,10 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <!-- 导航栏 -->
 <div th:replace="~{common/header::header(activeUrl='blog')}"></div>
-
 <main role="main" class="container mt-3 p-3 bg-white rounded">
    <div class="row">
        <div class="col-md-12 blog-main">
--- a/src/main/resources/templates/blog/write.html
+++ b/src/main/resources/templates/blog/write.html
@@ -6,7 +6,7 @@
    <title>论坛-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/wangedit/css/wang.style.css}"/>
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        .nav-underline .nav-link {
            padding-top: .75rem;
@@ -16,7 +16,7 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <!-- 导航栏 -->
 <div th:replace="~{common/header::header(activeUrl='blog')}"></div>
--- a/src/main/resources/templates/common/header.html
+++ b/src/main/resources/templates/common/header.html
@@ -4,7 +4,7 @@

 <!-- 导航栏 -->
 <nav th:fragment="header" class="navbar sticky-top navbar-expand-lg navbar-light"
-     style="background-color: #ffffff;box-shadow: 0px -2px 10px #d0cccc;">
+     style="opacity: 0.9;background-color: #ffffff;box-shadow: 0px -2px 10px #d0cccc;">
    <div class="container">
        <!--标题-->
        <a class="navbar-brand">
@@ -84,10 +84,7 @@
                    </li>
                </ul>
            </div>
-
        </div>
    </div>
 </nav>
-
-
 </html>
--- a/src/main/resources/templates/error/4xx.html
+++ b/src/main/resources/templates/error/4xx.html
@@ -5,7 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>关于我们-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 </head>
 <body>
 <div th:replace="~{common/header::header(activeUrl='')}"></div>
--- a/src/main/resources/templates/error/5xx.html
+++ b/src/main/resources/templates/error/5xx.html
@@ -5,7 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>关于我们-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 </head>
 <body>
 <div th:replace="~{common/header::header(activeUrl='')}"></div>
--- a/src/main/resources/templates/index.html
+++ b/src/main/resources/templates/index.html
@@ -5,6 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>首页-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 </head>
 <body>

--- a/src/main/resources/templates/login.html
+++ b/src/main/resources/templates/login.html
@@ -5,35 +5,47 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>登录-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
-    <link rel="stylesheet" th:href="@{/css/login.css}">
+    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrapValidator.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 </head>
 <body class="text-center">
-<form class="form-signin needs-validation" th:action="@{/login}" method="post">
-
-    <img class="mb-4" th:src="@{/images/logo/logo.png}" alt="" width="72" height="72">
-
-    <input name="username" class="form-control" placeholder="用户名" required="">
-    <input type="password" name="password" class="form-control" placeholder="密码" required="">
-
-    <div class="checkbox float-left mb-3">
-        <label>
-            <input type="checkbox" name="remember" value="remember-me"> 记住密码
-        </label>
+<div class="container">
+    <div class="row">
+        <div class="col-md-4" >
+        </div>
+        <div class="col-md-4 mt-5" id='login_box'>
+            <form class="form-horizontal" method="post" th:action="@{/login}">
+                <div class="justify-content-center">
+                    <h1 class="d-block">登录<small style="font-size: small">Quinn</small></h1>
+                    <p class="d-block" th:text="${registerMsg}" style="color: red"></p>
+                </div>
+                <div class="form-group">
+                    <label for="username">用户名</label>
+                    <input id="username" name="username" class="form-control" placeholder="用户名" required="">
+                </div>
+                <div class="form-group">
+                    <label for="password">密码</label>
+                    <input id="password" type="password" name="password" class="form-control" placeholder="密码">
+                </div>
+                <div class="checkbox float-left mb-3">
+                    <label>
+                        <input type="checkbox" name="remember" value="remember-me"> 记住密码
+                    </label>
+                </div>
+                <button class="btn btn-dark btn-block" type="submit" onclick="this.disabled=true; this.form.submit();">登 录</button>
+                <p class="mt-1 clearfix">
+                    <a style="color: white" th:href="@{/register}" class="float-right text-decoration-none">没有账号？去注册</a>
+                </p>
+            </form>
+        </div>
+        <div class="col-md-4" >
+        </div>
    </div>
-
-    <button class="btn btn-lg btn-primary btn-block mt-3" type="submit" onclick="this.disabled=true; this.form.submit();">登 录</button>
-
-    <p class="clearfix">
-        <a th:href="@{/register}" class="float-right">没有账号？去注册</a>
-    </p>
-
-    <p class="badge badge-pill badge-light">©QUINN</p>
-</form>
-<a class="to-top badge badge-light">返回顶部</a>
+</div>
 <script th:src="@{/js/jquery-3.5.1.min.js}"></script>
 <script th:src="@{/bootstrap/js/bootstrap.bundle.min.js}"></script>
-<script th:src="@{/js/toTop.js}"></script>
 <script th:src="@{/js/jquery-ui.min.js}"></script>
 <script th:src="@{/live/js/addlive2d.js}"></script>
+<script th:src="@{/bootstrap/js/bootstrapValidator.js}"></script>
 </body>
 </html>
--- a/src/main/resources/templates/page/about.html
+++ b/src/main/resources/templates/page/about.html
@@ -6,7 +6,7 @@
    <title>关于我们-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/css/timeline.css}">
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 </head>
 <body>

--- a/src/main/resources/templates/page/allsearch.html
+++ b/src/main/resources/templates/page/allsearch.html
@@ -5,6 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>论坛-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 <style>
    #maxLength {
        max-width: 720px;
@@ -14,7 +15,7 @@
    }
 </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <div th:replace="~{common/header::header(activeUrl='blog')}"></div>

--- a/src/main/resources/templates/page/append.html
+++ b/src/main/resources/templates/page/append.html
@@ -6,7 +6,7 @@
    <title>关于我们-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/css/timeline.css}">
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 </head>
 <body>

--- a/src/main/resources/templates/register.html
+++ b/src/main/resources/templates/register.html
@@ -5,31 +5,117 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>注册-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
-    <link rel="stylesheet" th:href="@{/css/login.css}">
+    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrapValidator.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 </head>
-<body class="text-center">
-
-<form class="form-signin needs-validation" th:action="@{/register}" method="post">
-    <img class="mb-4" th:src="@{/images/logo/logo.png}" alt="" width="72" height="72">
-    <p th:text="${registerMsg}" style="color: red"></p>
-
-    <input type="text" name="username" class="form-control mb-2" placeholder="用户名" pattern="[a-zA-Z0-9]+" required=true>
-    <input type="password" name="password" class="form-control" placeholder="密码" required=true>
-    <input type="password" name="repassword" class="form-control" placeholder="确认密码" required="">
-    <input type="text" name="code" class="form-control" placeholder="邀请码" required=true>
-
-    <button class="btn btn-lg btn-primary btn-block mt-3" type="submit" onclick="this.disabled=true; this.form.submit();">注 册</button>
-
-    <p class="clearfix">
-        <a th:href="@{/toLogin}" class="float-right">已有账号？去登录</a>
-    </p>
-    <p class="badge badge-pill badge-light">©QUINN</p>
-</form>
-<a class="to-top badge badge-light">返回顶部</a>
+<body>
+<div class="container">
+    <div class="row">
+        <div class="col-md-4" >
+        </div>
+        <div class="col-md-4 mt-5" id='login_box'>
+            <form id="registerForm" class="form-horizontal" method="post" action="#">
+                <div class="justify-content-center">
+                        <h1 class="d-block">注册<small style="font-size: small">Quinn</small></h1>
+                        <p class="d-block" th:text="${registerMsg}" style="color: red"></p>
+                </div>
+                <div class="form-group">
+                    <label for="username">用户名</label>
+                    <input id="username" type="text" name="username" class="form-control" placeholder="用户名">
+                </div>
+                <div class="form-group">
+                    <label for="password">密码</label>
+                    <input id="password" type="password" name="password" class="form-control" placeholder="密码">
+                </div>
+                <div class="form-group">
+                    <label for="repassword">确认密码</label>
+                    <input id="repassword" type="password" name="repassword" class="form-control" placeholder="确认密码">
+                </div>
+                <div class="form-group">
+                    <label for="email">email</label>
+                    <input id="email" type="text" name="email" class="form-control" placeholder="邮箱">
+                </div>
+                <div class="form-group">
+                    <label for="code">邀请码</label>
+                    <input id="code" type="text" name="code" class="form-control" placeholder="邀请码">
+                </div>
+                <button class="btn btn-dark btn-block" type="submit" onclick="this.disabled=true; this.form.submit();">注 册</button>
+                <p class="mt-1 clearfix">
+                    <a style="color: white" th:href="@{/toLogin}" class="float-right text-decoration-none">已有账号？去登录</a>
+                </p>
+            </form>
+        </div>
+        <div class="col-md-4" >
+        </div>
+    </div>
+</div>
 <script th:src="@{/js/jquery-3.5.1.min.js}"></script>
 <script th:src="@{/bootstrap/js/bootstrap.bundle.min.js}"></script>
-<script th:src="@{/js/toTop.js}"></script>
 <script th:src="@{/js/jquery-ui.min.js}"></script>
 <script th:src="@{/live/js/addlive2d.js}"></script>
+<script th:src="@{/bootstrap/js/bootstrapValidator.js}"></script>
+<script type="text/javascript">
+    $(function(){
+        $('#registerForm').bootstrapValidator({
+            message: 'This value is not valid',
+            feedbackIcons: {
+                valid: 'glyphicon glyphicon-ok',
+                invalid: 'glyphicon glyphicon-remove',
+                validating: 'glyphicon glyphicon-refresh'
+            },
+            fields: {
+                username: {
+                    message: 'The username is not valid',
+                    validators: {
+                        notEmpty: {
+                            message: 'The username is required and can\'t be empty'
+                        },
+                        stringLength: {
+                            min: 6,
+                            max: 30,
+                            message: 'The username must be more than 6 and less than 30 characters long'
+                        },
+                        regexp: {
+                            regexp: /^[a-zA-Z0-9_\.]+$/,
+                            message: 'The username can only consist of alphabetical, number, dot and underscore'
+                        }
+                    }
+                },
+                email: {
+                    validators: {
+                        notEmpty: {
+                            message: 'The email address is required and can\'t be empty'
+                        },
+                        emailAddress: {
+                            message: 'The input is not a valid email address'
+                        }
+                    }
+                },
+                password: {
+                    validators: {
+                        notEmpty: {
+                            message: 'The password is required and can\'t be empty'
+                        }
+                    }
+                }
+            }
+        }).on('success.form.bv', function(e) {
+            alert(e);
+                // Prevent form submission
+                e.preventDefault();
+
+                // Get the form instance
+                var $form = $(e.target);
+
+                // Get the BootstrapValidator instance
+                var bv = $form.data('bootstrapValidator');
+
+                // Use Ajax to submit form data
+                $.post($form.attr('action'), $form.serialize(), function(result) {
+                    console.log(result);
+                }, 'json');
+            });
+        });
+</script>
 </body>
 </html>
--- a/src/main/resources/templates/source/editorSource.html
+++ b/src/main/resources/templates/source/editorSource.html
@@ -6,6 +6,7 @@
    <title>论坛-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/wangedit/css/wang.style.css}"/>
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        input[type="file"] {
            　　width: 100%;
@@ -17,7 +18,7 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <!-- 导航栏 -->
 <main role="main" class="container mt-3 p-3 bg-white rounded">
--- a/src/main/resources/templates/source/hotspot.html
+++ b/src/main/resources/templates/source/hotspot.html
@@ -5,6 +5,8 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>资源库-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 <style>
    #maxLength {
        max-width: 500px;
--- a/src/main/resources/templates/source/list.html
+++ b/src/main/resources/templates/source/list.html
@@ -5,6 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>资源库-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        #maxLength {
            max-width: 500px;
@@ -14,7 +15,7 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <div th:replace="~{common/header::header(activeUrl='source')}"></div>

--- a/src/main/resources/templates/source/uploadSource.html
+++ b/src/main/resources/templates/source/uploadSource.html
@@ -6,7 +6,7 @@
    <title>资源-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/wangedit/css/wang.style.css}"/>
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        input[type="file"] {
            　　width: 100%;
@@ -19,7 +19,7 @@
    </style>

 </head>
-<body style="background: #f2f2f2;">
+<body>
 <main role="main" class="container mt-3 p-3 bg-white rounded">
    <div class="row">
        <div class="col-md-12 blog-main">
--- a/src/main/resources/templates/source/view.html
+++ b/src/main/resources/templates/source/view.html
@@ -6,9 +6,9 @@
    <title>资源下载-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/wangedit/css/wang.style.css}"/>
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <!-- 导航栏 -->
 <div th:replace="~{common/header::header(activeUrl='source')}"></div>
--- a/src/main/resources/templates/user/index.html
+++ b/src/main/resources/templates/user/index.html
@@ -6,6 +6,7 @@
    <title>用户中心-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/hover/component.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        #table-title tr th{
            border: none;
@@ -18,7 +19,7 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <div th:replace="~{common/header::header(activeUrl='user')}"></div>

--- a/src/main/resources/templates/user/settings.html
+++ b/src/main/resources/templates/user/settings.html
@@ -5,6 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>用户中心-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <link rel="stylesheet" th:href="@{/hover/component.css}">
    <style>
        #table-title tr th{
@@ -12,7 +13,7 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <div th:replace="~{common/header::header(activeUrl='user')}"></div>
 <main role="main" class="container">
--- a/src/main/resources/templates/user/user-comment.html
+++ b/src/main/resources/templates/user/user-comment.html
@@ -5,7 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>用户中心-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        #table-title tr th{
            border: none;
@@ -18,7 +18,7 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <div th:replace="~{common/header::header(activeUrl='user')}"></div>

--- a/src/main/resources/templates/user/user-star.html
+++ b/src/main/resources/templates/user/user-star.html
@@ -5,7 +5,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>用户中心-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
-
+    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
    <style>
        #table-title tr th{
            border: none;
@@ -18,7 +18,7 @@
        }
    </style>
 </head>
-<body style="background: #f2f2f2;">
+<body>

 <div th:replace="~{common/header::header(activeUrl='user')}"></div>