当前位置： 首页 > news >正文

如何使用ssm实现班级同学录网站

news 2025/5/5 5:55:49

@TOC

10912ssm班级同学录网站

系统概述

进过系统的分析后，就开始记系统的设计，系统设计包含总体设计和详细设计。总体设计只是一个大体的设计，经过了总体设计，我们能够划分出系统的一些东西，例如文件、文档、数据等。而且我们通过总体设计，大致可以划分出了程序的模块，以及功能。但是只是一个初步的分类，并没有真正的实现。

整体设计，只是一个初步设计，而且，对于一个项目，我们可以进行多个整体设计，通过对比，包括性能的对比、成本的对比、效益的对比，来最终确定一个最优的设计方案，选择优秀的整体设计可以降低开发成本，增加用户效益，从这一点来讲，整体设计还是非常重要的。

班级同学录网站工作原理图如图4-1所示：

图4-1 系统工作原理图

4.2 系统结构设计

系统架构图属于系统设计阶段，系统架构图只是这个阶段一个产物，系统的总体架构决定了整个系统的模式，是系统的基础。班级同学录网站的整体结构设计如图4-2所示。

图4-2 系统结构图

4.3数据库设计

数据库是计算机信息系统的基础。目前，电脑系统的关键与核心部分就是数据库。数据库开发的优劣对整个系统的质量和速度有着直接影响。

4.3.1 数据库设计原则

数据库的概念结构设计采用实体—联系（E-R）模型设计方法。E-R模型法的组成元素有：实体、属性、联系，E-R模型用E-R图表示，是提示用户工作环境中所涉及的事物，属性则是对实体特性的描述。在系统设计当中数据库起着决定性的因素。下面设计出这几个关键实体的实体—关系图。

4.3.2 数据库实体

数据模型中的实体（Entity），也称为实例，对应现实世界中可区别于其他对象的“事件”或“事物”。例如，学校中的每个学生，家里中的每个家具。

本系统的E-R图如下图所示：

1、用户管理实体图如图4-3所示：

图4-3用户管理实体图

2、同学录管理实体图如图4-4所示：

图4-4同学录管理实体图

3、聚会报名管理实体图如图4-5所示：

图4-5聚会报名管理实体图

#########

4.3.3 数据库表设计

数据库的表信息属于设计的一部分，下面介绍数据库中的各个表的详细信息。

表4-1 gonggaoxinxi表

列名数据类型长度约束
idint11NOT NULL
usernamevarchar50default NULL
biaotivarchar50default NULL
tupianvarchar50default NULL
gonggaoneirongvarchar50default NULL
fabushijianvarchar50default NULL

表4-2 juhuibaoming表

列名数据类型长度约束
idint11NOT NULL
addtimevarchar50default NULL
yonghumingvarchar50default NULL
xingmingvarchar50default NULL
shoujihaomavarchar50default NULL
juhuishijianvarchar50default NULL
juhuididianvarchar50default NULL
baomingshijianvarchar50default NULL

表4-3：tongxuelu表

列名数据类型长度约束
idint11NOT NULL
addtimevarchar50default NULL
yonghumingvarchar50default NULL
xingmingvarchar50default NULL
touxiangvarchar50default NULL
xingbievarchar50default NULL
shoujihaomavarchar50default NULL
youxiangvarchar50default NULL
banjivarchar50default NULL
jiebievarchar50default NULL

表4-4：xiaoyoufengcai表

列名数据类型长度约束
idint11NOT NULL
addtimevarchar50default NULL
xingmingvarchar50default NULL
tupianvarchar50default NULL
xingbievarchar50default NULL
fengguangshijivarchar50default NULL
zaixiaoshijianvarchar50default NULL

表4-5：yonghu表

列名数据类型长度约束
idint11NOT NULL
addtimevarchar50default NULL
yonghumingvarchar50default NULL
mimavarchar50default NULL
xingmingvarchar50default NULL
touxiangvarchar50default NULL
xingbievarchar50default NULL
shoujihaomavarchar50default NULL
youxiangvarchar50default NULL

5系统详细设计

5.1前台首页功能模块

班级同学录网站，在前台首页可以查看首页、公告信息、校友风采、论坛信息、我的、跳转到后台、客服等内容，如图5-1所示。

图5-1前台首页功能界面图

用户注册，在用户注册页面可以填写用户名、姓名、头像、性别、手机号码、邮箱等信息进行注册，如图5-2所示。

图5-2用户注册界面图

用户登录，在用户登录页面通过填写账号、密码等信息完成登录，如图5-3所示。在论坛中心页面通过填写标题、类型、内容等信息进行发布帖子等操作，如图5-4所示。

图5-3用户登录界面图

图5-4论坛中心界面图

5.2管理员功能模块

管理员登录，通过填写注册时输入的用户名、密码进行登录，如图5-5所示。

图5-5管理员登录界面图

管理员登录进入班级同学录网站可以查看个人中心、用户管理、公告信息管理、同学录管理、校友风采管理、聚会报名管理、论坛管理、系统管理等信息。

用户管理，在用户管理页面中可以通过填写用户名、姓名、头像、性别、手机号码、邮箱等内容进行查看、修改、删除等操作，如图5-6所示。还可以根据需要对公告信息管理进行查看、修改、删除等操作，如图5-7所示。

图5-6用户管理界面图

图5-7公告信息管理界面图

同学录管理，在同学录管理页面中可以填写用户名、姓名、头像、性别、手机号码、邮箱、班级、届别等信息，并可根据需要对已有同学录管理进行查看、修改或删除等操作，如图5-8所示。

图5-8同学录管理界面图

校友风采管理，在校友风采管理页面中可以填写姓名、图片、性别、风光事迹、在校时间等信息，并可根据需要对已有校友风采管理进行查看、修改或删除等详细操作，如图5-9所示。

图5-9校友风采管理界面图

聚会报名管理，在聚会报名管理页面中可以填写用户名、姓名、手机号码、聚会时间、聚会地点、报名时间等内容，并且根据需要对已有聚会报名管理进行查看、修改或删除等详细操作，如图5-10所示。

图5-10聚会报名管理界面图

论坛管理，在论坛管理页面中可以填写帖子标题、帖子内容、父节点id、用户id、用户名 状态等内容，并且根据需要对已有论坛管理进行查看、修改或删除等详细操作，如图5-11所示。

图5-11论坛管理界面图

轮播图；该页面为轮播图管理界面。管理员可以在此页面进行首页轮播图的管理，通过新建操作可在轮播图中加入新的图片，还可以对以上传的图片进行修改操作，以及图片的删除操作，如图5-12所示。

图5-12轮播图管理界面图

5.3用户功能模块

用户登录进入班级同学录网站可以查看个人中心、同学录管理、聚会报名管理等内容。同学录管理，在同学录管理页面中通过填写用户名、姓名、头像、性别、手机号码、邮箱、班级、届别等信息，还可以根据需要对同学录管理进行查看、添加等操作，如图5-13所示。

图5-13同学录管理界面图

聚会报名管理，在聚会报名管理页面中可以填写用户名、姓名、手机号码、聚会时间、聚会地点、报名时间等信息，并且根据需要对已有聚会报名管理进行查看、添加等其他详细操作，如图5-14所示。

图5-14聚会报名管理界面图

ForumController.java
package com.controller;import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;import com.entity.ForumEntity;
import com.entity.view.ForumView;import com.service.ForumService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;/*** 论坛表* 后端接口* @author * @email * @date 2021-03-12 15:20:53*/
@RestController
@RequestMapping("/forum")
public class ForumController {@Autowiredprivate ForumService forumService;/*** 后端列表*/@RequestMapping("/page")public R page(@RequestParam Map<String, Object> params,ForumEntity forum, HttpServletRequest request){if(!request.getSession().getAttribute("role").toString().equals("管理员")) {forum.setUserid((Long)request.getSession().getAttribute("userId"));}EntityWrapper<ForumEntity> ew = new EntityWrapper<ForumEntity>();PageUtils page = forumService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, forum), params), params));request.setAttribute("data", page);return R.ok().put("data", page);}/*** 前端列表*/@RequestMapping("/list")public R list(@RequestParam Map<String, Object> params,ForumEntity forum, HttpServletRequest request){if(!request.getSession().getAttribute("role").toString().equals("管理员")) {forum.setUserid((Long)request.getSession().getAttribute("userId"));}EntityWrapper<ForumEntity> ew = new EntityWrapper<ForumEntity>();PageUtils page = forumService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, forum), params), params));request.setAttribute("data", page);return R.ok().put("data", page);}/*** 列表*/@IgnoreAuth@RequestMapping("/flist")public R flist(@RequestParam Map<String, Object> params,ForumEntity forum, HttpServletRequest request){EntityWrapper<ForumEntity> ew = new EntityWrapper<ForumEntity>();PageUtils page = forumService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.allEq(ew, forum), params), params));return R.ok().put("data", page);}/*** 查询*/@RequestMapping("/query")public R query(ForumEntity forum){EntityWrapper< ForumEntity> ew = new EntityWrapper< ForumEntity>();ew.allEq(MPUtil.allEQMapPre( forum, "forum")); ForumView forumView =  forumService.selectView(ew);return R.ok("查询论坛表成功").put("data", forumView);}/*** 后端详情*/@RequestMapping("/info/{id}")public R info(@PathVariable("id") Long id){ForumEntity forum = forumService.selectById(id);return R.ok().put("data", forum);}/*** 前端详情*/@RequestMapping("/detail/{id}")public R detail(@PathVariable("id") Long id){ForumEntity forum = forumService.selectById(id);return R.ok().put("data", forum);}/*** 论坛详情*/@IgnoreAuth@RequestMapping("/list/{id}")public R list(@PathVariable("id") String id){ForumEntity forum = forumService.selectById(id);getChilds(forum);return R.ok().put("data", forum);}private ForumEntity getChilds(ForumEntity forum) {List<ForumEntity> childs = new ArrayList<ForumEntity>();childs = forumService.selectList(new EntityWrapper<ForumEntity>().eq("parentid", forum.getId()));if(childs == null || childs.size()==0) {return null;}forum.setChilds(childs);for(ForumEntity forumEntity : childs) {getChilds(forumEntity);}return forum;}/*** 后端保存*/@RequestMapping("/save")public R save(@RequestBody ForumEntity forum, HttpServletRequest request){forum.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(forum);forum.setUserid((Long)request.getSession().getAttribute("userId"));forumService.insert(forum);return R.ok();}/*** 前端保存*/@RequestMapping("/add")public R add(@RequestBody ForumEntity forum, HttpServletRequest request){forum.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(forum);forum.setUserid((Long)request.getSession().getAttribute("userId"));forumService.insert(forum);return R.ok();}/*** 修改*/@RequestMapping("/update")public R update(@RequestBody ForumEntity forum, HttpServletRequest request){//ValidatorUtils.validateEntity(forum);forumService.updateById(forum);//全部更新return R.ok();}/*** 删除*/@RequestMapping("/delete")public R delete(@RequestBody Long[] ids){forumService.deleteBatchIds(Arrays.asList(ids));return R.ok();}/*** 提醒接口*/@RequestMapping("/remind/{columnName}/{type}")public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, @PathVariable("type") String type,@RequestParam Map<String, Object> map) {map.put("column", columnName);map.put("type", type);if(type.equals("2")) {SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");Calendar c = Calendar.getInstance();Date remindStartDate = null;Date remindEndDate = null;if(map.get("remindstart")!=null) {Integer remindStart = Integer.parseInt(map.get("remindstart").toString());c.setTime(new Date()); c.add(Calendar.DAY_OF_MONTH,remindStart);remindStartDate = c.getTime();map.put("remindstart", sdf.format(remindStartDate));}if(map.get("remindend")!=null) {Integer remindEnd = Integer.parseInt(map.get("remindend").toString());c.setTime(new Date());c.add(Calendar.DAY_OF_MONTH,remindEnd);remindEndDate = c.getTime();map.put("remindend", sdf.format(remindEndDate));}}Wrapper<ForumEntity> wrapper = new EntityWrapper<ForumEntity>();if(map.get("remindstart")!=null) {wrapper.ge(columnName, map.get("remindstart"));}if(map.get("remindend")!=null) {wrapper.le(columnName, map.get("remindend"));}int count = forumService.selectCount(wrapper);return R.ok().put("count", count);}}
CommonServiceImpl.java

package com.service.impl;import java.util.List;
import java.util.Map;import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;import com.dao.CommonDao;
import com.service.CommonService;/*** 系统用户*/
@Service("commonService")
public class CommonServiceImpl implements CommonService {@Autowiredprivate CommonDao commonDao;@Overridepublic List<String> getOption(Map<String, Object> params) {return commonDao.getOption(params);}@Overridepublic Map<String, Object> getFollowByOption(Map<String, Object> params) {return commonDao.getFollowByOption(params);}@Overridepublic void sh(Map<String, Object> params) {commonDao.sh(params); }@Overridepublic int remindCount(Map<String, Object> params) {return commonDao.remindCount(params);}@Overridepublic Map<String, Object> selectCal(Map<String, Object> params) {return commonDao.selectCal(params);}@Overridepublic List<Map<String, Object>> selectGroup(Map<String, Object> params) {return commonDao.selectGroup(params);}@Overridepublic List<Map<String, Object>> selectValue(Map<String, Object> params) {return commonDao.selectValue(params);}}
GonggaoxinxiController.java
package com.controller;import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;import com.entity.GonggaoxinxiEntity;
import com.entity.view.GonggaoxinxiView;import com.service.GonggaoxinxiService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;/*** 公告信息* 后端接口* @author * @email * @date 2021-03-12 15:20:53*/
@RestController
@RequestMapping("/gonggaoxinxi")
public class GonggaoxinxiController {@Autowiredprivate GonggaoxinxiService gonggaoxinxiService;/*** 后端列表*/@RequestMapping("/page")public R page(@RequestParam Map<String, Object> params,GonggaoxinxiEntity gonggaoxinxi, HttpServletRequest request){EntityWrapper<GonggaoxinxiEntity> ew = new EntityWrapper<GonggaoxinxiEntity>();PageUtils page = gonggaoxinxiService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, gonggaoxinxi), params), params));request.setAttribute("data", page);return R.ok().put("data", page);}/*** 前端列表*/@IgnoreAuth@RequestMapping("/list")public R list(@RequestParam Map<String, Object> params,GonggaoxinxiEntity gonggaoxinxi, HttpServletRequest request){EntityWrapper<GonggaoxinxiEntity> ew = new EntityWrapper<GonggaoxinxiEntity>();PageUtils page = gonggaoxinxiService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, gonggaoxinxi), params), params));request.setAttribute("data", page);return R.ok().put("data", page);}/*** 列表*/@RequestMapping("/lists")public R list( GonggaoxinxiEntity gonggaoxinxi){EntityWrapper<GonggaoxinxiEntity> ew = new EntityWrapper<GonggaoxinxiEntity>();ew.allEq(MPUtil.allEQMapPre( gonggaoxinxi, "gonggaoxinxi")); return R.ok().put("data", gonggaoxinxiService.selectListView(ew));}/*** 查询*/@RequestMapping("/query")public R query(GonggaoxinxiEntity gonggaoxinxi){EntityWrapper< GonggaoxinxiEntity> ew = new EntityWrapper< GonggaoxinxiEntity>();ew.allEq(MPUtil.allEQMapPre( gonggaoxinxi, "gonggaoxinxi")); GonggaoxinxiView gonggaoxinxiView =  gonggaoxinxiService.selectView(ew);return R.ok("查询公告信息成功").put("data", gonggaoxinxiView);}/*** 后端详情*/@RequestMapping("/info/{id}")public R info(@PathVariable("id") Long id){GonggaoxinxiEntity gonggaoxinxi = gonggaoxinxiService.selectById(id);return R.ok().put("data", gonggaoxinxi);}/*** 前端详情*/@IgnoreAuth@RequestMapping("/detail/{id}")public R detail(@PathVariable("id") Long id){GonggaoxinxiEntity gonggaoxinxi = gonggaoxinxiService.selectById(id);return R.ok().put("data", gonggaoxinxi);}/*** 后端保存*/@RequestMapping("/save")public R save(@RequestBody GonggaoxinxiEntity gonggaoxinxi, HttpServletRequest request){gonggaoxinxi.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(gonggaoxinxi);gonggaoxinxiService.insert(gonggaoxinxi);return R.ok();}/*** 前端保存*/@RequestMapping("/add")public R add(@RequestBody GonggaoxinxiEntity gonggaoxinxi, HttpServletRequest request){gonggaoxinxi.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(gonggaoxinxi);gonggaoxinxiService.insert(gonggaoxinxi);return R.ok();}/*** 修改*/@RequestMapping("/update")public R update(@RequestBody GonggaoxinxiEntity gonggaoxinxi, HttpServletRequest request){//ValidatorUtils.validateEntity(gonggaoxinxi);gonggaoxinxiService.updateById(gonggaoxinxi);//全部更新return R.ok();}/*** 删除*/@RequestMapping("/delete")public R delete(@RequestBody Long[] ids){gonggaoxinxiService.deleteBatchIds(Arrays.asList(ids));return R.ok();}/*** 提醒接口*/@RequestMapping("/remind/{columnName}/{type}")public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, @PathVariable("type") String type,@RequestParam Map<String, Object> map) {map.put("column", columnName);map.put("type", type);if(type.equals("2")) {SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");Calendar c = Calendar.getInstance();Date remindStartDate = null;Date remindEndDate = null;if(map.get("remindstart")!=null) {Integer remindStart = Integer.parseInt(map.get("remindstart").toString());c.setTime(new Date()); c.add(Calendar.DAY_OF_MONTH,remindStart);remindStartDate = c.getTime();map.put("remindstart", sdf.format(remindStartDate));}if(map.get("remindend")!=null) {Integer remindEnd = Integer.parseInt(map.get("remindend").toString());c.setTime(new Date());c.add(Calendar.DAY_OF_MONTH,remindEnd);remindEndDate = c.getTime();map.put("remindend", sdf.format(remindEndDate));}}Wrapper<GonggaoxinxiEntity> wrapper = new EntityWrapper<GonggaoxinxiEntity>();if(map.get("remindstart")!=null) {wrapper.ge(columnName, map.get("remindstart"));}if(map.get("remindend")!=null) {wrapper.le(columnName, map.get("remindend"));}int count = gonggaoxinxiService.selectCount(wrapper);return R.ok().put("count", count);}}
topNav.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><style>.top-brand {position: fixed;top: 0;z-index: 998;width: 100%;height: 64px;padding: 0;margin: 0;border-radius: 0;border-width: 0 0px 70px 0;border-style: solid;border-color: rgba(21, 168, 72, 1);background-color: rgba(255, 255, 255, 1);box-shadow: 0 0 0px rgba(30, 144, 255, .8);}.top-brand .navbar-default {width: 100%;height: 64px;padding: 0 35px;margin: 0;border-radius: 0;border-width: 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: rgba(255, 255, 255, 1);box-shadow: 0 0 6px rgba(30, 144, 255, 0);justify-content: space-between;display: flex;flex-wrap: wrap;align-items: center;box-sizing: border-box;}.top-brand .navbar-default .navbar-header a {width: auto;line-height: 44px;padding: 0;margin: 0;color: rgba(21, 168, 72, 1);font-size: 20px;border-radius: 0;border-width: 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: rgba(0,0,0,0);box-shadow: 0 0 0px rgba(30, 144, 255, 0);}.top-brand .nav .fullscreen {display: none;padding: 8px;margin: 0 0 0 10px;color: #fff;font-size: 16px;border-radius: 50%;border-width: 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: #00c5dc;box-shadow: 0 0 6px rgba(0, 0, 0, .3);}.top-brand .nav .ti-user {padding: 8px;margin: 0 0 0 10px;color: #fff;font-size: 16px;border-radius: 50%;border-width: 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: rgba(21, 168, 72, 1);box-shadow: 0 0 0px rgba(0, 0, 0, .3);}.top-brand .nav .dropdown-menu.profile {width: 150px;height: auto;padding: 0;margin: 0;border-radius: 4px;border-width: 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: #fff;box-shadow: 0 0 6px rgba(30, 144, 255, .8);left: inherit;right: 0;top: 100%;min-width: auto;margin-top: 9px;}.top-brand .nav .dropdown-menu.profile::before {left: 100%;margin-left: -28px;border-bottom-color: #333;}.top-brand .nav .dropdown-menu.profile h5 {width: 100%;line-height: 44px;padding: 0 12px;margin: 0;color: #fff;font-size: 16px;border-radius: 4px 4px 0 0;border-width: 0;border-style: solid;border-color: #333;background-color: #333;box-shadow: 0 0 6px rgba(30, 144, 255, 0);text-align: center;}.top-brand .nav .dropdown-menu.profile .web {width: 100%;height: auto;padding: 0 12px;margin: 0;border-radius: 0;border-width: 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: #fff;box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .nav .dropdown-menu.profile .web span.ti-power-off {padding: 2px;margin: 0 10px 0 0;color: #fff;font-size: 12px;border-radius: 50%;border-width: 0;border-style: solid;border-color: #333;background-color: #333;box-shadow: 0 0 6px rgba(30, 144, 255, .3);}.top-brand .nav .dropdown-menu.profile .web span.text {padding: 0;margin: 0;width: auto;line-height: 44px;color: #333;font-size: 16px;border-radius: 0;border-width: 0;border-style: solid;border-color: #333;background-color: rgba(0,0,0,0);box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .nav .dropdown-menu.profile .web:hover{width: 100%;height: auto;padding: 0 12px;margin: 0;border-radius: 0;border-width: 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: #333;box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .nav .dropdown-menu.profile .web:hover span.ti-power-off{padding: 2px;margin: 0 10px 0 0;color: #333;font-size: 12px;border-radius: 50%;border-width: 0;border-style: solid;border-color: #fff;background-color: #fff;box-shadow: 0 0 6px rgba(30, 144, 255, .3);}.top-brand .nav .dropdown-menu.profile .web:hover span.text{padding: 0;margin: 0;width: auto;line-height: 44px;color: #fff;font-size: 16px;border-radius: 0;border-width: 0;border-style: solid;border-color: #fff;background-color: rgba(0,0,0,0);box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .nav .dropdown-menu.profile .exit {width: 100%;height: auto;padding: 0 12px;margin: 0;border-radius: 0 0 4px 4px;border-width: 1px 0 0 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: #fff;box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .nav .dropdown-menu.profile .exit span.ti-power-off {padding: 2px;margin: 0 10px 0 0;color: #fff;font-size: 12px;border-radius: 50%;border-width: 0;border-style: solid;border-color: #333;background-color: #333;box-shadow: 0 0 6px rgba(30, 144, 255, .3);}.top-brand .nav .dropdown-menu.profile .exit span.text {padding: 0;margin: 0;width: auto;line-height: 44px;color: #333;font-size: 16px;border-radius: 0;border-width: 0;border-style: solid;border-color: #333;background-color: rgba(0,0,0,0);box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .nav .dropdown-menu.profile .exit:hover{width: 100%;height: auto;padding: 0 12px;margin: 0;border-radius: 0 0 4px 4px;border-width: 1px 0 0 0;border-style: solid;border-color: rgba(0,0,0,.3);background-color: red;box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .nav .dropdown-menu.profile .exit:hover span.ti-power-off{padding: 2px;margin: 0 10px 0 0;color: #333;font-size: 12px;border-radius: 50%;border-width: 0;border-style: solid;border-color: #fff;background-color: #fff;box-shadow: 0 0 6px rgba(30, 144, 255, .3);}.top-brand .nav .dropdown-menu.profile .exit:hover span.text{padding: 0;margin: 0;width: auto;line-height: 44px;color: #fff;font-size: 16px;border-radius: 0;border-width: 0;border-style: solid;border-color: #fff;background-color: rgba(0,0,0,0);box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .menu-list-title {display: none;}padding: 0;margin: 0;width: 180px;line-height: $template2.back.top.logo.lineHeight;color: #fff;font-size: 16px;border-radius: 0;border-width: 0;border-style: solid;border-color: #333;background-color: rgba(0, 197, 220, 1);box-shadow: 0 0 6px rgba(30, 144, 255, 0);}.top-brand .menu-list-title:before {content: "logo";display: block;text-align: center;line-height: $template2.back.top.logo.lineHeight;}</style><div class="container top-brand" style="display: flex;"><div class="menu-list-title"></div><nav class="navbar navbar-default">			<div class="navbar-header"><a href="${pageContext.request.contextPath}/index.jsp">班级同学录网站</a></div><ul class="nav justify-content-end"><li class="nav-item"><a class="nav-link"><span class="ti-fullscreen fullscreen"></span></a>							</li><li class="nav-item" style="position: relative;"><a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true"aria-expanded="false"><span class="ti-user"></span></a><div class="dropdown-menu lochana-box-shadow2 profile animated flipInY"><h5>John Willing</h5><a class="dropdown-item web" href="#" onclick="toFront()"><span class="ti-power-off"></span><span class="text">跳到前台</span></a><a class="dropdown-item exit" href="#" onclick="logout()"><span class="ti-power-off"></span><span class="text">退出</span></a></div></li></ul></nav></div>

声明

本博客适用于广泛的学术和教育用途，包括但不限于个人学习、开发设计，产品设计。仅供学习参考，旨在为读者提供深入理解和学术研究的材料。


http://www.mrgr.cn/news/48631.html

相关文章：

  • 机器学习——自动化机器学习（AutoML）
  • 【Web开发】第一弹：HTML表格基础与应用实例
  • 每日一练：两个字符串的最小ASCLL删除和
  • python根据端口查询出pid号是多少
  • GRS、GOTS、OCS、BCI、RDS的区别
  • ElasticSearch+Kibana 8.1.0安装部署
  • webm格式怎么转换成mp4？这几种方法可以轻松完成视频转换！
  • 基于Arduino的花瓶
  • mig IP核的学习
  • 前端开发攻略---前端ocr图片文字提取功能
  • WHAT - OpenAPI 规范和开放 API
  • 最全Python爬虫教程，学会你也是大师了！
  • 柯桥学日语日常口语入门教学当日本人说「すごいね」时，该怎么回？
  • 系统缺失mfc140.dll的修复方法,有效修复错误mfc140.dll详细步骤
  • sed删除每行末尾的空格或制表符
  • MES管理系统提升智能工厂四大核心能力
  • 数据结构 - 链表
  • 86 NAT 理论
  • 高德地图怎么定位自己的店铺？
  • 【排序算法】直接插入排序和希尔排序的全方位解读