基于SpringBoot的后台管理系统（1）登录、注册模块

最新推荐文章于 2024-07-30 13:51:05 发布

code&&coder

最新推荐文章于 2024-07-30 13:51:05 发布

阅读量2.2k

点赞数 2

分类专栏： SpringBoot 后台管理系统

本文链接：https://blog.csdn.net/u010906468/article/details/107126256

版权

这篇博客介绍了如何在SpringBoot项目中搭建后台管理系统的登录和注册功能，包括login.html和register.html页面的设计与实现。

摘要由CSDN通过智能技术生成

登录、注册模块

登录界面
注册界面
工程结构
- 登录页login.html
- 注册页register.html

登录界面

在这里插入图片描述

注册界面

在这里插入图片描述

工程结构

登录页login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" charset="UTF-8">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <title>Title</title>
<style>
    .login-form {
   
        position: absolute;
        top: 30%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        min-height: 300px;
        height: auto;
    }
    body{
   
        background: url(../image/login.jpg) no-repeat;
        background-size:100%;
    }

</style>

</head>
<body>

<div class="container-fluid " >
    <div class="login-form  col-lg-4 col-lg-offset-4  col-sm-6 col-sm-offset-3 col-xs-8 col-xs-offset-2 ">
        <div class="row">

            <div class="col-md-6 column">
                <div>
                    <img src="image/linux.png" class="img-rounded" width="200" height="50">
                </div>
                <div>
                    <br>
                    <strong>欢迎使用zhanghw后台管理系统 </strong>

                </div>
                <div>
                    <br>
                    <p>技术选型：</p>
                    <img src="image/right.jpg" class="img-rounded" width="14" height="14"><a href=