码云链接:https://gitee.com/eiumc123/12.git
百度云链接:链接:https://pan.baidu.com/s/1ej-JvlRfRYe8KzGje-ULOQ
提取码:fnmv
(文件中有视频,过大无法上传到码云,所以。。。)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title> 仿制网站</title>
<style type="text/css">
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
border: 1px solid #e7e7e7;
background-color: #000000;
}
<html>
<head>
<meta charset="utf-8">
<title> 仿制网站</title>
<style type="text/css">
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
border: 1px solid #e7e7e7;
background-color: #000000;
}
li {
float: left;
}
float: left;
}
li a {
display: block;
color: #FFFFFF;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
display: block;
color: #FFFFFF;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #6C6C6C;
}
background-color: #6C6C6C;
}
li a.active {
color: white;
background-color: #4CAF50;
}
</style>
<style type="text/css">
@import "2.css";
</style>
</head>
color: white;
background-color: #4CAF50;
}
</style>
<style type="text/css">
@import "2.css";
</style>
</head>
<body bgcolor="
#A0A0A0 ">
<ul>
<li><a class="active" href="https://www.ubisoft.com.cn/">首页</a></li>
<li><a href="https://www.ubisoft.com.cn/games">游戏</a></li>
<li><a href="http://ubi.li/e4emt">商城</a></li>
<li><a href="https://www.ubisoft.com.cn/uplay">支持</a></li>
</ul>
<ul>
<li><a class="active" href="https://www.ubisoft.com.cn/">首页</a></li>
<li><a href="https://www.ubisoft.com.cn/games">游戏</a></li>
<li><a href="http://ubi.li/e4emt">商城</a></li>
<li><a href="https://www.ubisoft.com.cn/uplay">支持</a></li>
</ul>
<script type="text/javascript" src="2.js"></script>
<div class="slideshow-container">
<div class="mySlides fade">
<div class="numbertext">1 / 5</div>
<div align="center"><img src="1.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
<div class="mySlides fade">
<div class="numbertext">1 / 5</div>
<div align="center"><img src="1.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
<div class="mySlides fade">
<div class="numbertext">2 / 5</div>
<div align="center"><img src="2.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
<div class="numbertext">2 / 5</div>
<div align="center"><img src="2.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
<div class="mySlides fade">
<div class="numbertext">3 / 5</div>
<div align="center"><img src="3.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
<div class="mySlides fade">
<div class="numbertext">4 / 5</div>
<div align="center"><img src="4.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
<div class="mySlides fade">
<div class="numbertext">5 / 5</div>
<div align="center"><img src="5.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
</div>
<div class="numbertext">3 / 5</div>
<div align="center"><img src="3.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
<div class="mySlides fade">
<div class="numbertext">4 / 5</div>
<div align="center"><img src="4.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
<div class="mySlides fade">
<div class="numbertext">5 / 5</div>
<div align="center"><img src="5.jpg" width="100%" height="600" style="width:100%"></div>
<div class="text"></div>
</div>
</div>
<div style="text-align:center">
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
</div>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
</div>
<script>
var slideIndex = 0;
showSlides();
function showSlides() {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("dot");
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex > slides.length) {slideIndex = 1}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" active", "");
}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
setTimeout(showSlides, 4000);
}
</script>
<p><center><h1>全人物CG<h1></center></p>
<p align="center">
<video width="1000" height="900" muted loop controls autoplay="autoplay" >
<source src="全人物.mp4" type="video/mp4">
<source src="全人物.ogg" type="video/ogg">
<source src="全人物.webm" type="video/webm">
<object data="全人物.mp4" width="1000" height="900">
<embed src="全人物.swf" width="1000" height="900">
</object>
</p>
</video>
<p><center><h1>起源<h1></center></p>
var slideIndex = 0;
showSlides();
function showSlides() {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("dot");
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex > slides.length) {slideIndex = 1}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" active", "");
}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
setTimeout(showSlides, 4000);
}
</script>
<p><center><h1>全人物CG<h1></center></p>
<p align="center">
<video width="1000" height="900" muted loop controls autoplay="autoplay" >
<source src="全人物.mp4" type="video/mp4">
<source src="全人物.ogg" type="video/ogg">
<source src="全人物.webm" type="video/webm">
<object data="全人物.mp4" width="1000" height="900">
<embed src="全人物.swf" width="1000" height="900">
</object>
</p>
</video>
<p><center><h1>起源<h1></center></p>
<p align="center">
<video width="1000" height="900" muted loop controls autoplay="autoplay">
<source src="开始.mp4" type="video/mp4">
<source src="开始.ogg" type="video/ogg">
<source src="开始.webm" type="video/webm">
<object data="开始.mp4" width="1000" height="900">
<embed src="开始.swf" width="1000" height="900">
</object>
</p>
</body>
</html>
<video width="1000" height="900" muted loop controls autoplay="autoplay">
<source src="开始.mp4" type="video/mp4">
<source src="开始.ogg" type="video/ogg">
<source src="开始.webm" type="video/webm">
<object data="开始.mp4" width="1000" height="900">
<embed src="开始.swf" width="1000" height="900">
</object>
</p>
</body>
</html>
主要实现了幻灯片轮换和水平导航栏,最后插入了两个彩虹六号的视频,添加了控制按钮和图标。