人口信息普查系统-JavaWeb-三
今天给大家分享前端主页面的代码,设有五个功能。涉及到增删改查,用到了超链接的跳转。
<!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-三的更多相关文章
- 人口信息普查系统-JavaWeb-一
建民说要期中考试了,我赶紧翻阅了去年的考试题目,去年的试题是要求做一个人口普查系统.我就试着做了一下,今天主要和大家分享题目要求. 其中考试确实有些难度,用到了许多没有接触过的知识,比如JavaScr ...
- 人口信息普查系统-JavaWeb-五
今天分享人口普查系统删除查询前端代码 <%@ page language="java" contentType="text/html; UTF-8" pa ...
- 人口信息普查系统-JavaWeb-四
今天给大家分享前端人口登记页面,人口查询页面 人口登记 <%@ page language="java" contentType="text/html; chars ...
- 人口信息普查系统-JavaWeb-二
上次发表了人口普查系统的题目要求,今天和大家分享一下我的技术方案. 技术上用到的是html+jsp+JavaBean+servlet+JavaScript 其实现在的前端页面主流还是html,它可以实 ...
- “MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第三篇(登录窗口的实现以及如何保存登录者的信息)
一.前言: 1.再看这篇文章的时候,您是否已经完成前两篇介绍的文章里的功能了?(Tabs页的添加,Tabs页右键的关闭,主题的更换) 2.今天来说说登录窗口吧,看截图: ...
- 《Spring_Four》第三次作业——基于Jsoup的大学生考试信息展示系统的原型设计与开发
<Spring_Four团队>第三次团队项目——基于Jsoup的大学生考试信息展示系统的原型设计与开发 一.实验目的与要求 (1)掌握软件原型开发技术: (2)学习使用软件原型开发工具:本 ...
- 毕业设计java实验室预约管理系统SSH机房预约系统javaweb机房实验室排课系统mysql机房管理系统 实验室管理系统 课程设计 代码讲解 调试运行
毕业设计java实验室预约管理系统SSH机房预约系统javaweb机房实验室排课系统mysql机房管理系统 实验室管理系统 课程设计 代码讲解 调试运行 注意:该项目只展示部分功能,如需了解,评论区咨 ...
- 完成一个MVC+Nhibernate+Jquery-EasyUI信息发布系统
一.最近学习了Jquery-EasyUI框架,结合之前用过的MVC3+Nhibernate做一个信息发布系统,对工作一年半的自己做一个总结吧!(也正好 供初学者学习!) 二.先上截图(系统简介),让大 ...
- 【百度地图API】建立全国银行位置查询系统(三)——如何在地图上添加银行标注
原文:[百度地图API]建立全国银行位置查询系统(三)--如何在地图上添加银行标注 <摘要>你将在第三章中学会以下知识: 如何在地图上添加带银行logo的标注?(你也可以换成商场logo, ...
随机推荐
- 【LeetCode】951. Flip Equivalent Binary Trees 解题报告(Python)
作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 递归 日期 题目地址:https://leetcod ...
- 【LeetCode】887. Super Egg Drop 解题报告(Python)
作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 参考资料 日期 题目地址:https://leetc ...
- 【LeetCode】835. Image Overlap 解题报告(Python & C++)
作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 日期 题目地址:https://leetcode.c ...
- Redis的各种实现(Jedis、Redisson、Lettuce)
1.1.Jedis 是Redis的Java实现的客户端.支持基本的数据类型如:String.Hash.List.Set.Sorted Set. 特点:使用阻塞的I/O,方法调用同步,程序流需要等到so ...
- A ROBUST KERNEL PCA ALGORITHM
目录 引 主要内容 问题一 问题二 Lu C, Zhang T, Du X, et al. A robust kernel PCA algorithm[C]. international confer ...
- css怎么实现雪人
冬天来了,怎么能少的了雪人呢,不管是现实中还是程序员的代码中统统都的安排上,那就一次安排几个雪人兄弟,咱们先看效果图: 有喜欢的就赶紧cv拿走吧!!! 其详细代码如下: 图1 html部分: < ...
- 【云开发】10分钟零基础学会做一个快递查询微信小程序,快速掌握微信小程序开发技能(轮播图、API请求)
大家好,我叫小秃僧 这次分享的是10分钟零基础学会做一个快递查询微信小程序,快速掌握开发微信小程序技能. 这篇文章偏基础,特别适合还没有开发过微信小程序的童鞋,一些概念和逻辑我会讲细一点,尽可能用图说 ...
- [炼丹术]YOLOv5训练自定义数据集
YOLOv5训练自定义数据 一.开始之前的准备工作 克隆 repo 并在Python>=3.6.0环境中安装requirements.txt,包括PyTorch>=1.7.模型和数据集会从 ...
- web服务之nginx部署
本期内容概要 了解web服务 Nginx和Apache的对比 部署Nginx 内容详细 1.什么是web服务 Web服务是一种服务导向架构的技术,通过标准的Web协议提供服务,目的是保证不同平台的应用 ...
- mongdb分片
实验环境 主机 IP 虚拟通道 centos1 192.168.3.10 vmnet8 centos2 ...