关于动态门户WEB博雅互动的源代码(HTML+CSS+javascript)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>博雅互动</title>
<link rel="stylesheet" href="./CSS/index.css"> </head>
<body>
<div class = "box">
<div class = "nav">
<span><a href="http://www.boyaa.com"><img src="./images/logo.png"></a></span>
<ul>
<li class = "frist"><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 class = "last"><img src="./images/jrwm.png"></li>
</ul>
</div>
</div>
<div class = "banner">
<img src="./images/banner1.jpg" alt="" name = "banner">
</div> <div class = "bpt">
<div>
<img src="./images/bpt1.jpg" alt=""><p align = "center">BPT宣传片</p><p align = "center"><a href="#">点击播放</a></p>
</div><div>
<img src="./images/bpt2.jpg" alt=""><p align = "center">博雅互动宣传视频</p><p align = "center"><a href="#">点击播放</a></p>
</div><div>
<img src="./images/bpt3.jpg" alt=""><p align = "center">斗地主</p><p align = "center"><a href="#">点击播放</a></p>
</div><div class="bptlast">
<img src="./images/bpt4.jpg" alt="" class="imglast"><p align = "center">德州扑克</p><p align = "center"><a href="#">点击播放</a></p>
</div> </div>
<!--博雅新闻开始-->
<div class= "new">
<div class = "newone"><img src="./images/bynewsbg.jpg" alt="">
<ul>
<li><script type="text/javascript">
var today = new Date();
var y = today.getFullYear();
var m = today.getMonth()+1;
document.write(y+"/"+m)
</script> <a href="http://www.gdzsxx.com/news/dx/201612/106161.html"><strong>第三届宠物文化节在华南农业大学正式落幕</strong></a></li>
<li><script type="text/javascript">
var today = new Date();
var y = today.getFullYear();
var m = today.getMonth()+1;
document.write(y+"/"+m)
</script> <a href="http://gd.people.com.cn/n/2015/0122/c123932-23644282.html"><strong>杂交水稻之父袁隆平院士两度光临华农</strong></a></li>
<li>
<script type="text/javascript">
var today = new Date();
var y = today.getFullYear();
var m = today.getMonth()+1;
document.write(y+"/"+m)
</script> <a href="https://idol001.com/news/liyifeng/detail/54fd09997a1173350e8b49ba"><strong>李易峰,何炅《栀子花开》在华南农业大学取景</strong></a>
</li>
<li><script type="text/javascript">
var today = new Date();
var y = today.getFullYear();
var m = today.getMonth()+1;
document.write(y+"/"+m)
</script> <a href="http://hi.people.com.cn/n2/2016/0904/c231182-28944338.html"><strong>科比,库里在华南农业大学田家炳训练场</strong></a></li>
<li class=" last"><a href=""><img src="./images/more.png" alt=""></a></li>
</ul>
</div> <div class = "newtwo"><img src="./images/zczp.jpg" alt="">
<div>
<ul>
<li><img src="./images/zczp.png" alt=""></li>
<li class = "IMG2"><img src="./images/more2.png" alt=""></li>
</ul>
</div>
<div class="zp">
<ol>
<li><strong>专场招聘岗位</strong></li>
<li><a href="">PHP开发工程师</a></li>
<li><a href="">WEB前端开发工程师</a></li>
<li><a href="">JAVA开发工程师</a></li>
<li><a href="">IOS开发工程师</a></li>
</ol> </div> </div> </div>
<!--
1、图片轮播函数 开始定义 -->
<script>
var imgObjet = document.images[2];
console.log(imgObjet); setInterval(imgplay, 2000); var i =2;
function imgplay(){
imgObjet.src ="./images/banner"+i+".jpg"; i++;
if(i>4){
i = 1
}
} </script> <!-- 底部收尾栏开始 -->
<div class = "bottom">
<div class = "botone">
<ul>
<font color="#ffffff">
<li>网站地图 | 免责声明</li>
<li>Copyright®2017-2030博雅互动(Boyaa Interactive)粤ICP备999999号 增值电信业务许可证</li>
</font>
<li><img src="./images/govIcon.gif" alt="" width="60" height="85"></li>
</ul>
</div>
</div> </body>
</html>
*{
margin:0px;
padding:0px;
}
/* 清除HTML样式 */
a{
text-decoration: none;
color:#b12ff2;
}
a:hover{
text-decoration: underline;
color: #4d90fe;
}
.box{
width:100%;
height:58px;
border:1px solid;
background-color: #191d3a;
position: fixed;
z-index: 3px;
}
.nav span {
float: left;
margin-right: 60px;
}
.nav {
width:1248px;
height:58px;
margin:0 auto;
}
.nav li{
list-style-type: none;
float: left;
width: 100px;
height: 58px;
line-height: 58px;
text-align: center;
border-right: 2px solid #252947;
}
.nav .frist{
border-left: 2px solid #252947;
background-color: #252947;
}
.nav .last{
padding-left: 48px;
padding-top: 12px;
border-right: 0px;
}
/* 图片轮播栏开始 */
.banner{
width:100%;
height:463px;
padding-top: 58px;
}
.bpt{
width: 1050px;
height: 230px;
margin:0 auto;
margin-top: 50px;
border-bottom: 1px solid #dbe1e7;
}
.bpt div{
display: inline-block;
margin-right: 43px;
height:230px;
}
.bpt div img{
width:218px;
height: 130px
}
.bpt div .imglast{
width:217px;
}
.bpt a{
color:#38b774;
font-weight: bold;
}
/* 图片轮播栏结束 */
/* 博雅新闻开始 */
.new {
width:1000px;
height: 310px;
margin:12px auto;
}
.newone{
width:500px;
height: 310px;
display:inline-block;
}
.newtwo{
width:500px;
height: 310px;
position: relative;
left: 500px;
bottom: 507px;
}
.newone li{
display: block;
width:500px;
height: 40px;
line-height: 40px;
list-style-type: none;
position: relative;
bottom: 165px;
left:20px;
border-bottom: 1px solid #dbe1e7;
}
.newone .last{
border-bottom: none;
position: relative;
left:220px;
bottom: 440px;
}
.newtwo li{
list-style-type: none;
position: relative;
left:100px;
bottom: 275px;
}
.newtwo .IMG2{
position: relative;
left:250px;
bottom: 325px;
}
.zp{
position: relative;
right: 80px;
bottom: 20px;
}
.zp li{
width: 350px;
height: 37px;
line-height: 37px;
border-bottom: 1px solid #ffffff;
}
.zp a{
color: #ffffff;
}
/* 博雅新闻结束 */
/* 底部栏开始 */
.bottom{
width: 100%;
height: 130px;
background-color: #191d3a;
margin-top: 130px;
}
.botone{
width: 1000px;
height: 130px;
margin:0 auto;
}
.botone li{
list-style-type: none;
float: left;
height: 91px;
line-height: 130px;
margin-right: 35px;
}
.botone img{
margin-top: 20px;
}
预览图:(因为谷歌浏览器不支持全屏保存图片,因此用的是360浏览器打开,可能一些字体存在兼容性的问题,望忽略!)

关于动态门户WEB博雅互动的源代码(HTML+CSS+javascript)的更多相关文章
- how to create one single-file Web Component just using the HTML, CSS, JavaScript
how to create one single-file Web Component just using the HTML, CSS, JavaScript web components html ...
- Brackets - 强大免费的开源跨平台Web前端开发工具IDE (HTML/CSS/Javascript代码编辑器)
Brackets 是一个免费.开源且跨平台的 HTML/CSS/JavaScript 前端 WEB 集成开发环境 (IDE工具).该项目由 Adobe 创建和维护,根据MIT许可证发布,支持 Wind ...
- [转载]Brackets - 强大免费的开源跨平台Web前端开发工具IDE (HTML/CSS/Javascript代码编辑器)
http://brackets.io/ Brackets 是一个免费.开源且跨平台的 HTML/CSS/JavaScript 前端 WEB 集成开发环境 (IDE工具).该项目由 Adobe 创建和维 ...
- 在网页中动态地给表格添加一行内容--HTML+CSS+JavaScript
需求描述: 用户在页面上点击按钮,可以把文本框中的数据在表格的新的一行中显示,具体表现如下图: 如果如果输入框内容有一项为空,弹出对话框‘请将数据填入完全 步骤: 1.按钮注册单击事件 2.获取并判断 ...
- 深圳--博雅互动 Android面试打酱油归来
公司在TCL工业园E4,坐地到西丽站,那边在修路,不好走.B796公交站台在A出口的反方向,还要顺着施工的屏障打个弯,在西丽法院1上车.公司那边比较偏了,附近只有两趟公交.办公地点在10楼,出电梯就可 ...
- 动态调用web服务
通常我们在程序中需要调用WebService时,都是通过“添加Web引用”,让VS.NET环境来为我们生成服务代理,然后调用对应的Web服务.这样是使工作简单了,但是却和提供Web服务的URL.方法名 ...
- 在javaEE下学习web(在eclipse中开发动态的WEB工程,servlet的环境搭建,及servlet的一些方法)
一个简便的方法实现javaee版的eclipse开发动态的WEB工程(javaWEB项目)1.把开发选项切换到javaEE2. 可以在window->shou view 中找到package e ...
- 在Web.Config文件中使用configSource,避免动态修改web.config导致asp.net重启(另添加一个Config文件用于管理用户数据)
原文:在Web.Config文件中使用configSource,避免动态修改web.config导致asp.net重启(另添加一个Config文件用于管理用户数据) 我们都知道,在asp.net中修改 ...
- Eclipse拷贝动态的web工程修改context root的值
Eclipse拷贝动态的web工程修改context root的值 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. context root的名称一般是我们访问URL时的PATH路径 ...
随机推荐
- JavaScript设计模式-18.享元模式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- [心平气和读经典]The TCP/IP Guide(000)
The TCP/IP Guide [Page 39] The TCP/IP Guide: Introduction and "Guide to The Guide" | 第1章 概 ...
- Scrum 冲刺博客第七篇
一.当天站立式会议照片一张 二.每个人的工作 (有work item 的ID),并将其记录在码云项目管理中 昨天已完成的工作 对排行榜的界面和功能进行初步设计 今天计划完成的工作 重新对界面进行美化 ...
- 打乱数组——shuffle
在学习vue移动端音乐项目时,看到一个打乱数组函数,感觉很有意思就记录一下(意外发现:slice是个有趣的知识点) 原理:遍历数组,(let i = 0; i < _arr.length; i+ ...
- XMPP之openfire无法启动
之前半个月自学ios的时候自己也配置过xmpp框架,也从github上下载了demo试了下,也是很完美运行的,最近想着再回头把XMPP框架系统的学习一下 ,毕竟当时学的时候还是在虚拟机中,卡死了.我这 ...
- WINFORM如何实现无聚焦框的Button按钮
当我们将一个button按钮设置如下属性时,总有一个聚焦框来困扰着我们 button1.FlatStyle = FlatStyle.Flat; 我们想要的效果是这样的: 但当使用了Tab切换焦点时 发 ...
- 多边形游戏(DP)
Description 多边形游戏是一个单人玩的游戏,开始时有一个由n个顶点构成的多边形.每个顶点被赋予一个整数值,每条边被赋予一个运算符 "+" 或 "*". ...
- Docker学习(五): 仓库与数据管理
特别声明: 博文主要是学习过程中的知识整理,以便之后的查阅回顾.部分内容来源于网络(如有摘录未标注请指出).内容如有差错,也欢迎指正! =============系列文章============= 1 ...
- WPF月视图控件
简介 在做一个应用时,需要做成日历月视图的形式.自己做较麻烦,于是上网找找看,在CodeProject上发现了这个Quick and Simple WPF Month-view Calendar,可是 ...
- ssm集成redis
身在一个传统的IT公司,接触的新技术比较少,打算年后跳槽,所以抽空学了一下redis. 简单的redis测试,咱们这边就不讲了,现在主要讲讲ssm集成redis的过程,因为现在项目用的就是ssm的框架 ...