信息管理系统项目前端界面设计

数模竞赛Paid answer

已于 2022-07-21 14:13:41 修改

阅读量7.8k

点赞数 5

分类专栏：前端登录界面开发信息管理系统文章标签：前端开发登录界面开发信息管理系统

于 2022-03-25 15:55:41 首次发布

本文链接：https://blog.csdn.net/weixin_43292788/article/details/123736875

版权

前端登录界面开发同时被 2 个专栏收录

4 篇文章 4 订阅

订阅专栏

信息管理系统

4 篇文章 0 订阅

订阅专栏

信息管理系统

1.图书信息管理系统

2.学生信息管理系统

3.课程信息管理系统

4.档案信息管理系统

5.成绩信息管理系统

许多即将毕业的计算机专业学生不知道如何去做用户登录界面，做完简单页面之后又觉得太low了纯文字不够美观，现在我教你一个方法，既美观又简单的登录界面
只要是简单信息管理系统都可以使用的前端界面设计

用户登录首页界面

在这里插入图片描述
当然了，如第一次登录可注册之后再登录

用户注册界面

在这里插入图片描述
一个非常简单的登录注册页面就完成了
以下是程序代码：

<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>前端简单登录界面  由冷小曰制作</title>

<!--图标库 可无视-->
<link rel='stylesheet' href='css/font-awesome.min.css'>

<!--核心样式-->
<link rel="stylesheet" href="css/style.css">

</head>
<body>

<div class="container">
  <div class="card"></div>
  <div class="card">
    <h1 class="title">用户登录</h1>
    <form>
      <div class="input-container">
        <input type="#{type}" id="#{label}" required="required" />
        <label for="#{label}">用户名</label>
        <div class="bar"></div>
      </div>
      <div class="input-container">
        <input type="#{type}" id="#{label}" required="required" />
        <label for="#{label}">密码</label>
        <div class="bar"></div>
      </div>
      <div class="button-container">
        <button><span>登录</span></button>
      </div>
    </form>
  </div>
  <div class="card alt">
    <div class="toggle"></div>
    <h1 class="title">用户注册
      <div class="close"></div>
    </h1>
    <form>
      <div class="input-container">
        <input type="#{type}" id="#{label}" required="required" />
        <label for="#{label}">用户名</label>
        <div class="bar"></div>
      </div>
      <div class="input-container">
        <input type="#{type}" id="#{label}" required="required" />
        <label for="#{label}">密码</label>
        <div class="bar"></div>
      </div>
      <div class="input-container">
        <input type="#{type}" id="#{label}" required="required" />
        <label for="#{label}">确认密码</label>
        <div class="bar"></div>
      </div>
      <div class="button-container">
        <button><span>提交注册</span></button>
      </div>
    </form>
  </div>
</div>

<script src='js/jquery.min.js'></script>
<script src="js/script.js"></script>
<div style="text-align:center;">
<p>作者：冷小曰</a></p>
</div>
</body>
</html>

数模竞赛Paid answer

关注

5
点赞
踩
83

收藏

觉得还不错? 一键收藏
2
评论
信息管理系统项目前端界面设计

信息管理系统1.图书信息管理系统2.学生信息管理系统3.课程信息管理系统4.档案信息管理系统5.成绩信息管理系统许多即将毕业的计算机专业学生不知道如何去做用户登录界面，做完简单页面之后又觉得太low了纯文字不够美观，现在我教你一个方法，既美观又简单的登录界面只要是简单信息管理系统都可以使用的前端界面设计用户登录首页界面当然了，如第一次登录可注册之后再登录用户注册界面一个非常简单的登录注册页面就完成了以下是程序代码：<!DOCTYPE html><ht
复制链接

扫一扫

专栏目录