关于动态门户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路径 ...
随机推荐
- git 学习之撤销和删除
在实际的工作和学习中我们经常的会对文件进行修改,但是或多或少的就会发现由于某些原因修改是错误的这时候就需要对所做的修改进行撤销,更或者某些时候需要对文件进行删除.本节就会告诉大家如何操作. 撤销操作 ...
- linux centos 7.5 安装mysql5.7
1 下载tar包,这里使用wget从官网下载(注:下载地址随时可能有变动,wget命令默认下载目录为当前所在文件夹) wget https://dev.mysql.com/get/Downloads/ ...
- 图解ARP协议(四)代理ARP原理与实践(“善意的欺骗”)
一.代理ARP概述 我:当电脑要访问互联网上的服务器,目标MAC是什么? 很多小伙伴在刚学习网络协议的时候,经常这样直接回应:不就是服务器的MAC嘛! 这时我会反问:那电脑怎么拿到这个服务器的MAC地 ...
- (一)JNI基本概念
1. 基本概念: 首先,注意:C和C++在调用JNI时候方法是不一样的 注意看下面两个的区别: C++ #include <jni.h> #include <string> e ...
- WebUtility(提供在处理 Web 请求时用于编码和解码 URL 的方法。)
public static string UrlEncode( string str ) UrlEncode(String) 方法可用来编码整个 URL,包括查询字符串值. 如果没有编码情况下,如空格 ...
- openvpn应用场景案例【转】
转载至:http://www.linuxfly.org/post/86/ 一.案例1 针对不同的客户端指定不同的等级和权限.通常的方法是:1.每个客户端分配不同的IP地址:2.利用防火墙对不同的IP地 ...
- Echarts 使用asp.net +ashx+ajax 实现 饼图、柱形图后台交互
向上效果图 前端code /* * ------------------------------------------------------------------ * module-inform ...
- 基于环境变量为多用户配置不同的JDK(win)
情景 同一服务器同时部署不同项目需要使用不同的JRE 环境 Windows Server 2008 需求 用户admin 需要使用jdk1.8 用户admin1 需要使用jdk1.7 解决 通过配置用 ...
- eclipse 更改背景颜色字体
原文 切一个自己的图: 废话不说,直接入题. 方式一:替换Eclipse的配置文件 其实Eclipse的各种配置都是在文件设置里的,因此只要用一个配置好的模版来替换默认的配置文件,即可将所有配置克隆到 ...
- Win10系统安装vmware workstation 12后没有桥接网卡怎么办
原文 vmware workstation是一款虚拟机计算机软件,可以同时运行不同的操作系统,然而有win10系统用户在安装vmware workstation 12之后,却发现网络连接里面没有桥接网 ...