今天给大家分享前端主页面的代码，设有五个功能。涉及到增删改查，用到了超链接的跳转。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<style type="text/css">

    /* 清除默认样式 同时给所有元素设置样式 */

    * {

        margin: 0;

        padding: 0;

        font-family: "Open Sans Light";

        letter-spacing: .07em;

        /* 字母间隔大小 */

    }

    /* 因为下面想设置body、wrap区域的宽高为整个窗口高度 所以得先设置html也得这样设置

             这里得注意 body 和 html 的区别

             1.如果body及其子元素想设置高度为窗口高度 那么得设置h向下面这样设置html

             2.在body里面设置background-color时，发现整个窗口都会变了颜色 这容易产生错觉： body == 窗口

        */

    html {

        height: 100%;

    }

    body {

        height: 100%;

    }

    /* 继承窗口高度 设置一个渐变色向右渐变  渐变色推荐网站：https://www.sj520.cn/tools/jianbian/  应该有你喜欢的吧 */

    .wrap {

        height: 100%;

        background-image: linear-gradient(to right, #f3fafa, #f7f3fa);

    }

    /* 这个是登录区域 */

    .chuze-wrap {

        width: 400px;

        height: 600px;

        background-color: rgb(232, 232, 238);

        /* 居中开始 */

        position: relative;

        left: 50%;

        top: 50%;

        transform: translate(-50%, -50%);

        /* 居中结束 */

        border-radius: 10px;

        padding: 0 50px;

        /* 左右留出空余 */

    }

    .button6 {

        background: rgb(10, 10, 10);

        color: rgb(250, 252, 247);

        border: 1px solid rgb(246, 248, 250);

        transition-duration: 1s;

        /*过渡时间*/

        border-radius: 12px;

        padding: 13px 18px;

        margin-top: 20px;

        outline-style: none;

        /*去除点击时外部框线*/

        position: relative;

        left: 50%;

        top: 50%;

        transform: translate(-50%, -50%);

        width: 100%;

        line-height: 30px;

        border: 0;

        border-radius: 3px;

        margin-top: 20px;

        background-image: linear-gradient(to right, #808181, #959496);

        font-size: 16px;

        text-align: center;

        cursor: pointer;

        color: #f5f0f8;

        font-weight: bold;

    }

    .button6:hover {

        background: #f6f5f7;

        color: #f7f5f8;

        transition-duration: 1s;

    }

</style>

<body>

    <div class="wrap">

        <div class="chuze-wrap">

            <class class="chuze-title">

                <br>

                <div>

                    <br>

                    <br>

                    <a href="人口登记.jsp"><button class="button6">人口信息登记</button></a><br>

                    <a href="查询人口信息.html"><button class="button6">修改人口信息</button></a><br>

                    <a href="删除人口信息.jsp"><button class="button6">删除人口信息</button></a><br>

                    <a href="查询人口信息.jsp"><button class="button6">查询人口信息</button></tr></a>

                    <a href="/人口普查系统HtmlJsp/servlet?method=chaxun"><button class="button6">人口信息浏览</button></a><br></div>

        </div>

</body>

</html>

人口信息普查系统-JavaWeb-三的更多相关文章

  1. 人口信息普查系统-JavaWeb-一

    建民说要期中考试了,我赶紧翻阅了去年的考试题目,去年的试题是要求做一个人口普查系统.我就试着做了一下,今天主要和大家分享题目要求. 其中考试确实有些难度,用到了许多没有接触过的知识,比如JavaScr ...

  2. 人口信息普查系统-JavaWeb-五

    今天分享人口普查系统删除查询前端代码 <%@ page language="java" contentType="text/html; UTF-8" pa ...

  3. 人口信息普查系统-JavaWeb-四

    今天给大家分享前端人口登记页面,人口查询页面 人口登记 <%@ page language="java" contentType="text/html; chars ...

  4. 人口信息普查系统-JavaWeb-二

    上次发表了人口普查系统的题目要求,今天和大家分享一下我的技术方案. 技术上用到的是html+jsp+JavaBean+servlet+JavaScript 其实现在的前端页面主流还是html,它可以实 ...

  5. “MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第三篇（登录窗口的实现以及如何保存登录者的信息）

    一.前言: 1.再看这篇文章的时候,您是否已经完成前两篇介绍的文章里的功能了?(Tabs页的添加,Tabs页右键的关闭,主题的更换)                 2.今天来说说登录窗口吧,看截图: ...

  6. 《Spring_Four》第三次作业——基于Jsoup的大学生考试信息展示系统的原型设计与开发

    <Spring_Four团队>第三次团队项目——基于Jsoup的大学生考试信息展示系统的原型设计与开发 一.实验目的与要求 (1)掌握软件原型开发技术: (2)学习使用软件原型开发工具:本 ...

  7. 毕业设计java实验室预约管理系统SSH机房预约系统javaweb机房实验室排课系统mysql机房管理系统 实验室管理系统 课程设计 代码讲解 调试运行

    毕业设计java实验室预约管理系统SSH机房预约系统javaweb机房实验室排课系统mysql机房管理系统 实验室管理系统 课程设计 代码讲解 调试运行 注意:该项目只展示部分功能,如需了解,评论区咨 ...

  8. 完成一个MVC+Nhibernate+Jquery-EasyUI信息发布系统

    一.最近学习了Jquery-EasyUI框架,结合之前用过的MVC3+Nhibernate做一个信息发布系统,对工作一年半的自己做一个总结吧!(也正好 供初学者学习!) 二.先上截图(系统简介),让大 ...

  9. 【百度地图API】建立全国银行位置查询系统（三）——如何在地图上添加银行标注

    原文:[百度地图API]建立全国银行位置查询系统(三)--如何在地图上添加银行标注 <摘要>你将在第三章中学会以下知识: 如何在地图上添加带银行logo的标注?(你也可以换成商场logo, ...

随机推荐

  1. 【LeetCode】661. Image Smoother 解题报告（Python）

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 方法一:暴力解决 日期 题目地址:https://l ...

  2. 【LeetCode】764. Largest Plus Sign 解题报告（Python）

    [LeetCode]764. Largest Plus Sign 解题报告(Python) 作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn ...

  3. Docker 与 K8S学习笔记（三）—— 镜像的使用

    前面的文章介绍过镜像的三种获取方式: 下载并使用别人创建好的镜像: 在现有镜像上创建新的镜像: 从无到有创建镜像. 本文主要介绍前两种. 一.下载镜像 在Docker Hub上有大量优质镜像可以使用, ...

  4. Myeclipse查看jdk源代码

    过程如下: 1.点 "window"-> "Preferences" -> "Java" -> "Install ...

  5. HDU 6608：Fansblog（威尔逊定理）

    Fansblog Time Limit: 2000/2000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) Total Subm ...

  6. [linux]ubuntu18.04 屏幕分辨率不适应问题

    今天换了新显示器,发现更大的屏幕不适应原有的屏幕分辨率,看起来特别变扭. 在设置处查看最高分辨率仅为1024*748,没有与屏幕相适应的1920*1080(16:9). 解决方式: 1. 终端输入命令 ...

  7. elementUI表单嵌套表格并对每行进行校验

    elementUI表单嵌套表格并对每行进行校验 elementUI 表单嵌套表格并进行校验. 目录 效果展示 代码链接 关键代码 完整代码 效果展示 先看看这是不是需要的效果^_^ ​ 如图,Elem ...

  8. 使用JavaScript 中的Math对象和勾股定理公式，计算鼠标的位置与页面图片中心点的距离，根据距离对页面上的图片进行放大或缩小处理。距离远时图片放大，距离近时图片缩小

    查看本章节 查看作业目录 需求说明: 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理.距离远时图片放大,距离近 ...

  9. 使用 JavaScript 的 HTML 页面混合、JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接

    查看本章节 查看作业目录 需求说明: 使用 JavaScript 的 HTML 页面混合.JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出"点击我进 ...

  10. Kylin安装Version1.6.0

    Kylin安装,基于版本1.6.0,Kylin只有单机没有集群, 使用apache-kylin-1.6.0-hbase1.x-bin.tar.gz安装包. 1.安装规划 角色规划 IP/机器名 安装软 ...