上级练习3--制作全国公安机关互联网管理服务平台

练习的架构：

Boostrap的css样式代码需要自己下载，并且引入到项目里面
还有项目需要的图片资源需要自己下载哦
css样式页面：


body {font-family: "Helvetica Neue",Helvetica,Microsoft Yahei,Hiragino Sans GB,WenQuanYi Micro Hei,sans-serif!important;
}.head_form{margin: 20px;
}
.active a{color: #da001c;
}section{background: url("../image/adbg.png") 0 0 no-repeat;width: 100%;height: 385px;
}
h2{font-size: 16px;
}.formMain{margin-top: 50px;background: #fff;border-radius: 8px;
}
.form-group{padding-top: 20px;
}
footer{background: rgba(204, 204, 204, 0.6);padding: 20px;
}

主页的html：

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>全国公安机关互联网管理服务平台</title><!-- <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet"> --><link rel="stylesheet" type="text/css" href="css/bootstrap.css" /><link rel="stylesheet" type="text/css" href="css/component.css" /></head><body><header><div class="container"><div class="col-md-4"><h1><img src="./image/logo.png"></h1></div><div class="col-md-6 col-md-offset-2 text-right"><form action="#" class="form-inline head_form "><input type="search" class="form-control" placeholder="请输入要搜索的内容" /><input type="button" class="btn btn-success" value="搜索" /></form><ul class="list-inline"><li class="active"><a href="">首页</a></li><li><a href="">公共查询</a></li><li><a href="">常见问题</a></li><li><a href="">政策法规</a></li><li><a href="">通知公告</a></li><li><a href="">备案须知</a></li><li><a href="">备案展厅</a></li></ul></div></div></header><section><div class="container"><div class="row"><div class="col-md-8"><img src="./image/xcy.png" style="margin-top: 20px;"><br><img src="./image/liucheng.png" style="margin-top: 40px;margin-left: 80px;" alt=""></div><div class="col-md-4 formMain"><h2>普通用户</h2><form action="#"><div class="form-group form-horizontal"><span class="col-md-3 text-center">用户名:</span><div class="col-md-9"><input type="text" class="form-control"></div></div><br><div class="form-group form-horizontal"><span class="col-md-3 text-center">密码:</span><div class="col-md-9"><input type="text" class="form-control"></div></div><div class="form-group" style="margin-top:30px;"><div class="col-md-6 col-md-offset-3"><input type="checkbox">记住密码</div></div><!-- 设置登录按钮 --><div class="form-group col-md-offset-3"><div class="col-md-8 "><a href="" class="btn btn-danger form-control">登录</a></div></div><div class="form-group"><div class="col-md-6 col-md-offset-3"><p><a href="#">没有账号，注册</a></p></div></div></form></div></div></div></section><footer class="text-center"><p>Copyright2015 公安部网络安全保卫局 All Rights Reserved</p><p>邮箱：support@beian.gov.cn</p><p>京公网安备 11010102002019号 建议使用1024*768以上分辨率浏览</p></footer></body>
</html>

制作完成了之后的效果图：

路过的朋友们，喜欢的帮忙点个赞！

上级练习3--制作全国公安机关互联网管理服务平台相关推荐

天津天地伟业程序员怎么样_天地伟业助力全国公安机关执法信息化建设推进会顺利召开...
7月30日,全国公安机关执法信息化建设推进会在北京召开,会议总结推广北京市公安机关典型经验,就深化公安执法信息化建设进行部署. 图片摘选自"新民晚报" 会上,北京市公安局介绍了 ...
袋鼠云作为首批建设运营合作伙伴，助力中国（福建）茶产业互联网综合服务平台正式上线
按照福建省委.省政府工作部署,福建省商务厅牵头,福建省供销社会同省电子信息集团成立福茶网科技发展有限公司,加快推动中国(福建)茶产业互联网综合服务平台(以下简称"福茶网")建设. ...
医药/医疗/互联网医疗服务平台/问诊/挂号/开药/处方/医生/医院/问诊订单管理/移动端问诊医疗系统/医生端处方开药系统/web端医药服务平台管理/axure原型/rp源文件/健康咨询/视频问诊/统计
医药/医疗/互联网医疗服务平台/问诊/挂号/开药/处方/医生/医院/问诊订单管理/移动端问诊医疗系统/医生端处方开药系统/web端医药服务平台管理/处方管理/axure原型/rp源文件/健康咨询/视频 ...
实现“互联网+政务服务”平台与运政管理业务系统的数据自动流转，窗口工作人员不再手工二次录入--二次录入
我们在政务服务大厅交通窗办过业务的时候,应该对排着长队等待业务受理的场景记忆犹新. 窗口办事人员效率太低?速度太慢?事实真是如此吗? 一直以来,该窗口工作人员每天处理道路货运运营许可事项十多个,递交资 ...
临汾市互联网+政务服务平台
1. 页面提交数据通过form表单,在js中使用ajax 前端body部分 <div class="btndiv"><a class="listbtn ...
python selenium 爬取《全国农产品商务信息公共服务平台》
这是我参与的第二个项目,进程还是很顺利的.这也不断改进的过程,总共有三个版本: 第一个版本是普通的爬取,对于某个农产品关键词,获取它全部的内容,后来由于我的网速太差,python运行报错了,每个农产品 ...
湖北公安机关出台10条措施服务民营经济发展
<湖北省公安机关服务民营经济发展十条措施>新闻发布会现场许冰星摄 <湖北省公安机关服务民营经济发展十条措施>新闻发布会现场许冰星摄中新网武汉1月16日电 (武一力)记 ...
公共安全服务的隐形武器——公安共享服务平台解决方案
随着"金盾工程"的正式启动,公安行业信息化水平相对于以往的单一指挥调度来说,有一个巨大的进步,但随着公安业务的增加,除指挥中心对作战和巡逻指挥需要空间地理技术外,刑侦.治安.交通. ...
亮剑“互联网+政务服务”，航天信息助力政府“最多跑一次”改革
? 点击关注 2017年8月,航天信息联合浙江省台州市财政局在台州市立医院建设试点项目,开具出浙江省第一张门诊收费电子票据.截至2018年10月,航天信息已帮助浙江省的40多家医疗机构开具了近4 ...

上级练习3--制作全国公安机关互联网管理服务平台

上级练习3--制作全国公安机关互联网管理服务平台相关推荐

最新文章

热门文章