SWPU静态邮件登录界面
1.效果图:
2.代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>西南石油大学-计算机科学学院</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <style type="text/css"> body{ height: 1024px; width: 1224px; } .search-input{ border: 1px; float: left; width: 195px; margin-top: 2px; height: 25px; line-height: 30px; outline: none; font-family: "微软雅黑"; color: #c8c8c8; margin-left: 15px; position: relative; border-radius:10px; } .content{ margin-top: 10px; } .content ul li{ margin-left: 20px; padding: 3px; color:#c3c3c3 ; } .page-foot{ background-color: #061a95; height: 50px; padding-top:20px; text-align: center; color: white; } .btn{ margin-top: 2px; height: 28px; text-align: center; font-family: "微软雅黑"; color: black; margin-left: 10px; border:1px; border-radius:5px; } .page-navigationBar{ background-color: #0B6CB8; height: 4%; } .page-navigationBar a{ color: #ffffff; padding-top: 3px; text-decoration: none; } .top-ul>li{ float: left; list-style: none; padding: 0; margin: 14px; } ul{ padding: 0; margin: 0; } .nal-ul li{ list-style: none; } .top-ul li ul{ display: none; margin-top: 10px; } .nav-ul{ background-color: #0B6CB8; } .nav-ul li{ list-style: none; } .page-welcomeScreen{ background-image: url("../../imgMain/welcome.jpg"); height: 200px; } .page-content{ background-color: #f9f9f9; height: auto; margin-bottom: 10px; } .page-content .div-left{ display: inline; width: 550px; height: 50%; border: 1px; background-color: white; margin-top: 30px; float: left; } .page{ border: 1px; width: 974px; height: 1324px; margin-left: 12%; margin-right: 12%; } .page-head{ background-image: url("../../imgMain/top-bg.jpg"); height: 117px; } .form-search{ width: 287px; height: 38px; margin-top: 15px; float: right; } .page-content .div-right{ display: inline; width: 400px; height: 50%; border: 1px; background-color: white; margin-left: 2px; margin-top: 30px; float: right; } h3{ background-color: #0B6CB8; display: inline; width: 80px; color: whitesmoke; } .page-content span>a{ float: right; color: whitesmoke; font-size: 10px; padding-top: 5px; } .page-content a,p{ color: #c3c3c3; font-size: 14px; padding-top: 5px; text-decoration: none; } span{ width: 400px; } .content-title-left{ background-color: #DDDDDD; width: 550px; height: 25px; } .content-title-right{ background-color: #DDDDDD; width: 400px; height: 25px; } </style> <script> $(document).ready(function() { $(".top-ul li").mouseover(function () { $(this).find("ul").slideDown(); }); $(".top-ul li").mouseleave(function () { $(this).find("ul").hide(); }); }); </script> </head> <body> <div class="page"> <div class="page-head"> <div class="searchBox"> <form class="form-search"> <input class="search-input" type="text" placeholder="201631101227"/> <button type="submit" class="btn" style="cursor: hand">查找</button> </form> </div> </div> <div class="page-navigationBar"> <div class="top"> <div class="top_div"> <ul class="top-ul"> <li> <a href="#">网站首页</a> </li> <li> <a href="jump.html">学院概况</a> <ul class="nav-ul"> <li><a href="jump.html">学院简介</a></li> <li><a href="xygk/xyld.htm">学院领导</a></li> <li><a href="xygk/zzjg.htm">组织机构</a></li> </ul> </li> <li> <a href="#">本科生教育</a> <ul class="nav-ul"> <li><a href="bksjy/jsjkxyjszy.htm">计算机科学与技术专业</a></li> <li><a href="bksjy/rjgczy.htm">软件工程专业</a></li> <li><a href="bksjy/wlgczy.htm">网络工程专业</a></li> <li><a href="bksjy/wlwgczy.htm">物联网工程专业</a></li> <li><a href="bksjy/xxglyxxxtzy.htm">信息管理与信息系统专业</a></li> <li><a href="bksjy/wlkjaqzy.htm">网络空间安全专业</a></li> <li><a href="bksjy/sjkxydsjjszy.htm">数据科学与大数据技术专业</a></li> <li><a href="bksjy/dwrchzpyxm.htm">对外人才合作培养项目</a></li> <li><a href="bksjy/ksxx.htm">考试信息</a></li> <li><a href="bksjy/xkzxxx.htm">选课重修信息</a></li> <li><a href="bksjy/tzgg.htm">通知公告</a></li> <li><a href="bksjy/zlxz.htm">资料下载</a></li> <li><a href="bksjy/gxkjssp.htm">公选课教师视频</a></li> </ul> </li> <li> <a href="#">研究生教育</a> <ul class="nav-ul"> <li><a href="yjsjy/zsjz.htm">招生简章</a></li> <li><a href="yjsjy/jsjkxyjsyjxk.htm">计算机科学与技术一级学科</a></li> <li><a href="yjsjy/rjgcyjxk.htm">软件工程一级学科</a></li> <li><a href="yjsjy/wlkjaqyjxk.htm">网络空间安全一级学科</a></li> <li><a href="yjsjy/yjsds.htm">研究生导师</a></li> <li><a href="yjsjy/yjsjztx.htm">研究生奖助体系</a></li> <li><a href="yjsjy/tzgg.htm">通知公告</a></li> <li><a href="yjsjy/zlxz.htm">资料下载</a></li> </ul> </li> <li> <a href="#">师资队伍</a> <ul class="nav-ul"> <li><a href="szdw/js.htm">教授</a></li> <li><a href="szdw/fjs.htm">副教授</a></li> <li><a href="szdw/js1.htm">讲师</a></li> <li><a href="szdw/syry.htm">实验人员</a></li> </ul> </li> <li> <a href="#">科学研究</a> <ul class="nav-ul"> <li><a href="kxyj/kytd.htm">科研团队</a></li> <li><a href="kxyj/kypt.htm">科研平台</a></li> <li><a href="kxyj/kycg.htm">科研成果</a></li> </ul> </li> <li> <a href="#">学生工作</a> <ul class="nav-ul"> <li><a href="xsgz/gzdt.htm">工作动态</a></li> <li><a href="xsgz/tzgg.htm">通知公告</a></li> <li><a href="xsgz/kwcxsj.htm">课外创新实践</a></li> <li><a href="xsgz/bysjy.htm">毕业生就业</a></li> <li><a href="xsgz/xlzc.htm">心灵之窗</a></li> <li><a href="xsgz/qcfc.htm">青春风采</a></li> <li><a href="xsgz/zlxz.htm">资料下载</a></li> </ul> </li> <li> <a href="#">招生工作</a> <ul class="nav-ul"> <li><a href="zsgz/xyjs.htm">学院介绍</a></li> <li><a href="zsgz/bysjyqx.htm">毕业生就业去向</a></li> <li><a href="zsgz/yxbysjj.htm">优秀毕业生简介</a></li> <li><a href="zsgz/xshj.htm">学生获奖</a></li> <li><a href="zsgz/jyxyjs.htm">精英校友介绍</a></li> <li><a href="zsgz/zsgzxcbd.htm">招生工作宣传报道</a></li> </ul> </li> <li> <a href="#">实验中心</a> <ul class="nav-ul"> <li><a href="syzx/zxjj.htm">中心简介</a></li> <li><a href="syzx/syfs.htm">实验分室</a></li> <li><a href="syzx/gzzd.htm">规章制度</a></li> <li><a href="syzx/zlxz.htm">资料下载</a></li> <li><a href="http://syskf.swpu.edu.cn">开放预约</a></li> </ul> </li> <li> <a href="#">党建之窗</a> <ul class="nav-ul"> <li><a href="djzc/djdt.htm">党建动态</a></li> <li><a href="djzc/xxyd.htm">学习园地</a></li> <li><a href="djzc/dwzwgk.htm">党务政务公开</a></li> <li><a href="djzc/zlxz.htm">资料下载</a></li> </ul> </li> <!--可在此处直接添加导航--> </ul> </div><!--导航结束--> </div><!--导航结束--> </div> <div class="page-welcomeScreen"></div> <div class="page-content"> <div class=" image-information div-left" > <div class="content-title-left" > <h3 >图片新闻</h3> <span> <a>More>></a> </span> </div> <div> <div class="image" style="float: left;"> <img src="../../imgMain/img1.jpg" style="width: 230px;height: 200px;margin-top: 10px"> </div> <div class="content" style="float: right"> <ul> <li><a href="info/1045/4613.htm" title="计算机科学学院举办2019年寒假留校学生新春团拜会">计算机科学学院举办2019年寒假留校学生新春</a></li> <li><a href="info/1045/4643.htm" title="计科院工会组织学院女教职工庆祝第109个“三八妇女节”">计科院工会组织学院女教职工庆祝第109个“</a></li> <li><a href="info/1045/4633.htm" title="学术讲座——人工智能改变我们的未来生活">学术讲座——人工智能改变我们的未来生活</a></li> <li><a href="info/1045/4603.htm" title="计算机科学学院各年级辅导员集中走访学生寝室">计算机科学学院各年级辅导员集中走访学生寝</a></li> <li><a href="info/1045/4592.htm" title="学院召开2018年度领导班子民主生活会">学院召开2018年度领导班子民主生活会</a></li> <li><a href="info/1045/4589.htm" title="计科院与川庆安检院技术交流大会">计科院与川庆安检院技术交流大会</a></li> </ul> </div> </div> </div> <div class="academicCommunication div-right"> <div class="content-title-right" > <h3>学术交流</h3> <span> <a>More>></a> </span> </div> <div class="content"> <ul> <li> <a href="info/1076/4624.htm" title="人工智能改变我们的未来生活">人工智能改变我们的未来生活</a></li> <li> <a href="info/1076/4537.htm" title="计算时代的虚假信息传播">计算时代的虚假信息传播</a></li> <li> <a href="info/1076/4483.htm" title="人工智能+：视界充满AI">人工智能+：视界充满AI</a></li> <li> <a href="info/1076/4397.htm" title="零行列式策略及其网络演化动力学">零行列式策略及其网络演化动力学</a></li> <li> <a href="info/1076/4388.htm" title="视频遇上云服务">视频遇上云服务</a></li> <li> <a href="info/1076/4380.htm" title="计科院关于举行2018年校庆论文报告会的通知">计科院关于举行2018年校庆论文报告会的...</a></li> </ul> </div> </div> <div class="newsChannel div-left"> <div class="content-title-left" > <h3>新闻速递</h3> <span> <a>More>></a> </span> </div> <div> <div class="content"> <h3><a href="info/1045/4613.htm">计算机科学学院举办2019年寒假留校学生新春团拜会</a></h3> <p>​在中华民族传统节日——春节即将到来之际，为让学院留校学生感受家的温暖，向他们传达学院的慰问和祝福。2019年2月1日上午9时30分，计算机科学学院在明理楼B306会议室隆重举行2019年寒假留…[<span><a href="info/1045/4613.htm">详细信息</a></span>]</p> <ul> <li><a href="info/1045/4643.htm">计科院工会组织学院女教职工庆祝第109个“三八妇女节”</a></li> <li><a href="info/1045/4633.htm">学术讲座——人工智能改变我们的未来生活</a></li> <li><a href="info/1045/4603.htm">计算机科学学院各年级辅导员集中走访学生寝室</a></li> <li><a href="info/1045/4592.htm">学院召开2018年度领导班子民主生活会</a></li> <li><a href="info/1045/4589.htm">计科院与川庆安检院技术交流大会</a></li> <li><a href="info/1045/4599.htm">计算机科学学院分年级召开期末年级大会</a></li> </ul> </ul> </div> </div> </div> <div class="dynamicOfCommunist div-right"> <div class="content-title-right" > <h3>党建动态</h3> <span> <a>More>></a> </span> </div> <div class="content"> <ul> <li> <a href="info/1082/4593.htm" title="学院召开2018年领导班子民主生活会">学院召开2018年领导班子民主生活会</a></li> <li> <a href="info/1082/4520.htm" title="刘翔同志任计算机科学学院党委副书记、纪委书记">刘翔同志任计算机科学学院党委副书记、...</a></li> <li> <a href="info/1082/4512.htm" title="学院党委组织师生收看庆祝改革开放40周年大会">学院党委组织师生收看庆祝改革开放40周...</a></li> <li> <a href="info/1082/4464.htm" title="【审核评估】学院召开本科教学工作审核评估办学定位与目标宣讲大会">【审核评估】学院召开本科教学工作审核...</a></li> <li> <a href="info/1082/4424.htm" title="【聚焦评估】学院召开本科教学工作审核评估工作会">【聚焦评估】学院召开本科教学工作审核...</a></li> <li> <a href="info/1082/4471.htm" title="学院党委开展迎校庆主题党日活动">学院党委开展迎校庆主题党日活动</a></li> <li> <a href="info/1082/4376.htm" title="学院党委组织收看2018年全国科学道德和学风建设宣讲教育报告会">学院党委组织收看2018年全国科学道德和...</a></li> <li> <a href="info/1082/4356.htm" title="【聚焦评估】学院召开全院教职工大会部署本学期本科审核评估迎评促建工作">【聚焦评估】学院召开全院教职工大会部...</a></li> </ul> </div> </div> <div class="announcement div-left"> <div class="content-title-left" > <h3>通知公告</h3> <span> <a>More>></a> </span> </div> <div> <div class="content"> <ul> <li> <a href="info/1055/4638.htm">自组团出访前公示信息表（彭博）</a></li> <li> <a href="info/1055/4627.htm">计算机科学学院2019年春季学期开学教学准备及检查工作实施方案</a></li> <li> <a href="info/1055/4626.htm">西南石油大学计算机科学学院关于举行学院2019年春季田径运动会的通知</a></li> <li> <a href="info/1055/4600.htm">2018年秋季学期期末考试情况总结</a></li> <li> <a href="info/1055/4597.htm">计算机科学学院2018年度教职工考核优秀名单公示</a></li> <li> <a href="info/1055/4588.htm">国际学术会议（ICCIS2019）征稿通知</a></li> <li> <a href="info/1055/4584.htm">计算机科学学院领导班子2018年度民主生活会征求意见</a></li> <li> <a href="info/1055/4578.htm">关于表彰计算机科学学院2018-2019学年秋季学期“最美寝室”的通知</a></li> </ul> </div> </div> </div> <div class="projectList div-right"> <div class="content-title-right" > <h3>专题列表</h3> <span> <a>More>></a> </span> </div> <div class="content"> <ul> <li> <a href="info/1173/2003.htm" title="中美联合高性能和大数据计算实验室">中美联合高性能和大数据计算实验室</a></li> <li> <a href="info/1173/2004.htm" title="石油工程计算机模拟技术重点实验室">石油工程计算机模拟技术重点实验室</a></li> <li> <a href="info/1173/2005.htm" title="思科网络技术学院教师培训中心">思科网络技术学院教师培训中心</a></li> </ul> </div> </div> </div> </div> <div class="page-foot"><b>Copyright 2019 All Rights Reserved.西南石油大学计算机科学学院</b></div> </body> </html>
3.网盘链接:
链接：https://pan.baidu.com/s/1NVDYurPIroTCuwUzvE36ag
提取码：oikh
