Java WEB——人事管理系统

最新推荐文章于 2022-07-14 11:02:59 发布

CATKIN_ISME

最新推荐文章于 2022-07-14 11:02:59 发布

阅读量1w

点赞数 18

CC 4.0 BY-SA版权

分类专栏： code

本文链接：https://blog.youkuaiyun.com/CATKIN_ISME/article/details/91834582

本文介绍了作者在Java Web环境下构建人事管理系统的过程。数据库设计使用了特定的表结构，服务器选择Tomcat，并且需要添加mysql-connector-java库来连接数据库。网页设计上，采用Bootstrap框架提升视觉效果，同时分享了部分网页代码，尤其是表格样式的设计。作者面临的问题包括：背景图片的选择，查询结果显示方式，大型表格的展示策略，导航栏字体高亮的CSS实现，以及网页整体风格的统一。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这是我的一个小总结~

数据库

这是我数据库里设计的表，具体的我就不展示了……我用的服务器是tomcat，想要连接数据库就要在tomcat的lib中加入mysql-connector-java-5.1.8-bin.jar，才能连接成功！

网页

网页展示

在这里插入图片描述

我对网页的想法就是，先把表显示出来，然后下面再加功能，提交数据之后重新刷新回到该页面，拿到更新后的表……（不过说实话，我的设计风格很有问题，总感觉这个整体看着怪怪的~）只展示了部门管理和员工管理的页面，其他基本一样就不展示了……因为想要好看一些，所以我用了bootstrap框架（这是网上的一个教程https://www.runoob.com/bootstrap/bootstrap-tutorial.html）其中我的表格用了CSS来设计样式

部分代码展示

//登陆界面的代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>人事管理系统登录</title>
    <style>
        .cites{
            font-family: 华文细黑;
            background-color: rgba(150,150,150,0.3);
            color: black;
            align-content: space-around;
            margin: auto;
            border-radius: 30px;
            padding: 30px;
            width: 1600px;
            height: 725px;
        }
    </style>

    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

<body style="background: url(2.jpg); background-size: cover">
<br/>
<p style="text-align: center;font-family: 华文隶书;font-size: 40px">
    xxx公司人事管理系统
</p>
<br/><br/>
<div class="cites">
    <div class="row clearfix">
        <div class="col-md-7 column">
            <b style="font-family: 宋体;font-size: 30px">
                XXX公司简介
            </b>
            <p>
                <a class="btn" href="http://baidu.com">查看更多 »</a>
            </p>
            <div class="carousel slide" id="carousel-783096">
                <ol class="carousel-indicators">
                    <li class="active" data-target="#carousel-783096" data-slide-to="0">
                    </li>
                    <li data-target="#carousel-783096" data-slide-to="1">
                    </