You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

300 lines
13 KiB

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>明日方舟</title>
<link rel="shortcut icon" href="img/ico.webp" type="image/x-icon">
<link rel="stylesheet" type="text/css" href="zhou.css" />
<script src="./jquery.js"></script>
<link rel="stylesheet" href="./bootstrap.css">
<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
</head>
<body>
<div class="topnav" id="myTopnav">
<a href="#sec1" class="active" style="padding: 0%;"><img src="img/2c4c.png" class="img"></a>
<a href="#sec2">干员</a>
<a href="#sec3">游戏影像</a>
<a href="#sec4">游戏音乐</a>
<a href="#sec5">更多信息</a>
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>
</div>
<div class= "intro" id="sec1" style="padding-left:16px; ">
<div>
<br>
<h3>明日方舟</h3>
<p><b>《明日方舟》是由鹰角网络自主开发运营的一款策略向即时战略塔防游戏。游戏发生在一个被称作「泰拉世界」的幻想世界,在这里,供玩家差遣的可操控角色是「干员」,与敌人对抗。你将扮演一位名为「博士」的神秘角色,带领罗德岛的一众干员救助受难人群、处理矿石争端、对抗敌对势力——同时,寻找治愈「矿石病」的方法。</b></p>
<br></br>
<h3>游戏下载</h3>
</div>
<div class="down">
<div class="Img">
<img src="img/agex.png">
<img src="img/ewm.png" style="padding-left: 20px;padding-right: 20px;">
</div>
<div class="Btn">
<button onclick="adl()" style="cursor: pointer;"><b>安卓下载</b></button>
<img src="https://webusstatic.yo-star.com/ark_kr_web/pc/img/ios_download.2928664f.svg" onclick="asdl()" style="cursor: pointer;"></button>
</div>
</div>
</div>
<div class="wanfa" id="sec2" style="padding-left:16px; ">
<br><br> <br>
<p style="font-style: oblique;font-size: 2em;display: flex; align-items: center"><img src="https://patchwiki.biligame.com/images/arknights/2/20/n1g9uj7azpvtbpgitqsla213jdbyic9.png" width="97.5" height="93.5"><b>干员</b>
</p>
<p> 在游戏中,供玩家差遣的可操控角色“干员”不仅性格各异,在与敌人作战时也有着各自的专长。
由此,这些角色被分为了先锋、近卫、重装、狙击、特种、医疗、术师、辅助共计八个职业;并且每个职业亦被细分为多个分支职业。</p>
<br> <br>
<div class="parent">
<div>
<label for="t1" class="la" style="font-size: 2em;display: flex; align-items: center;text-indent: 3em;"><img src="img/xf.webp" width="46" height="46"><b>先锋</b></label>
<input type="checkbox" name="t" id="t1" class="t1">
<div class="content">
<div class="down">
<h3>风笛</h3>
<img src="img/xf.png" width=408;>
<p>先锋VANGUARD 对部署有更佳效果的职业。大多数能够提供增加部署费用的方法。
放置于近战位(除战术家外),费用和属性整体较低,主要造成物理伤害。</p>
</div>
</div>
</div>
<div>
<label for="t2" class="la" style="font-size: 2em;display: flex; align-items: center;text-indent: 3em"><img src="img/zz.webp" width="46" height="46"><b>重装</b></label>
<input type="checkbox" name="t" id="t2" class="t1">
<div class="content">
<div class="down">
<h3>星熊</h3>
<img src="img/zz.png" width=408;>
<p>重装DEFENDER 高生命与防御力的职业。
放置于近战位,攻击较低,防御及血量较高,攻击范围整体上较小,阻挡数较大,主要造成物理伤害。</p>
</div>
</div>
</div>
<div>
<label for="t3" class="la" style="font-size: 2em;display: flex; align-items: center;text-indent: 3em"><img src="img/yl.webp" width="46" height="46"><b>医疗</b></label>
<input type="checkbox" name="t" id="t3" class="t1">
<div class="content">
<div class="down">
<h3>凯尔希</h3>
<img src="img/yl.png" width=408;>
<p>医疗MEDIC 提供治疗,回复生命或元素损伤的职业。
放置于远程位,血量及防御较低。通常不具备攻击能力,但可以为友方干员恢复生命或元素损伤。</p>
</div>
</div>
</div>
<div>
<label for="t4" class="la" style="font-size: 2em;display: flex; align-items: center;text-indent: 3em"><img src="img/fz.webp" width="46" height="46"><b>辅助</b></label>
<input type="checkbox" name="t" id="t4" class="t1">
<div class="content">
<div class="down">
<h3>浊心斯卡蒂</h3>
<img src="img/fz.png" width=408;>
<p>辅助SUPPORTER 提供多样增益减益效果的职业。
放置于远程位(除工匠外),攻击中等,防御及血量较低,多以法术伤害为主。</p>
</div>
</div>
</div>
<div>
<label for="t5" class="la" style="font-size: 2em;display: flex; align-items: center;text-indent: 3em"><img src="img/jj.webp" width="46" height="46"><b>狙击</b></label>
<input type="checkbox" name="t" id="t5" class="t1">
<div class="content">
<div class="down">
<h3>W</h3>
<img src="img/jj.png" width=408;>
<p>狙击SNIPER 擅长远程物理攻击的输出职业。
费用差别很大,防御及血量通常较低,放置于远程位,主要造成物理伤害。</p>
</div>
</div>
</div>
<div>
<label for="t6" class="la" style="font-size: 2em;display: flex; align-items: center;text-indent: 3em"><img src="img/ss.webp" width="46" height="46"><b>术师</b></label>
<input type="checkbox" name="t" id="t6" class="t1">
<div class="content">
<div class="down"><h3>阿米娅</h3>
<img src="img/ss.png" width=408;>
<p>
术师CASTER 擅长远程法术攻击的输出职业。
放置于远程位,费用高,攻击较高,攻速较慢,防御及血量较低,法抗高,主要造成法术伤害。</p>
</div>
</div>
</div>
<div>
<label for="t7" class="la" style="font-size: 2em;display: flex; align-items: center;text-indent: 3em"><img src="img/tz.webp" width="46" height="46"><b>特种</b></label>
<input type="checkbox" name="t" id="t7" class="t1">
<div class="content">
<div class="down"><h3></h3>
<img src="img/tz.png" width=408;>
<p>特种SPECIALIST 攻击手段与部署方式多样化的职业。
部分干员可同时部署于高台或者地面。多以物理伤害为主,功能与属性相差很大。</p>
</div>
</div>
</div>
<div>
<label for="t8" class="la" style="font-size: 2em;display: flex; align-items: center;text-indent: 3em"><img src="img/jw.webp" width="46" height="46"><b>近卫</b></label>
<input type="checkbox" name="t" id="t8" class="t1">
<div class="content">
<div class="down"><h3></h3>
<img src="img/jw.png" width=408;>
<p>近卫GUARD 近战攻击为主的输出职业。
放置于近战位,攻击较高,防御中等。</p>
</div>
</div>
</div>
</div>
<div id="sec3">
<br>
<br>
<br>
<p style="color:whitesmoke;font-style: oblique;font-size: 2em;display: flex; align-items: center;text-align: right;"><img src="https://patchwiki.biligame.com/images/arknights/b/b4/12z8nkw0ftuoij80o821w7iwest2pxq.png" width="97.5" height="93.5"><b>游戏影像</b>
<div class="container">
<div class="sidebar">
<div class="video active" data-src="img/PV.mp4">
<img src="img/PV.jpg" alt="Video 1">
</div>
<div class="video" data-src="img/ZDYS.mp4">
<img src="img/zd.jpg" alt="Video 2">
</div>
<div class="video" data-src="img/TSYS.mp4">
<img src="img/ts.jpg" alt="Video 3">
</div>
<div class="video" data-src="img/JJYS.mp4">
<img src="img/jj.jpg" alt="Video 4">
</div>
</div>
<div class="main">
<video class="player show" controls autoplay src="img/PV.mp4">
</video>
</div>
</div>
</div>
<br id="sec4">
<br>
<br><br>
<div>
<p style="color:whitesmoke;font-style: oblique;font-size: 2em;display: flex; align-items: center;text-align: right;"><img src="https://patchwiki.biligame.com/images/arknights/0/0d/7wz3l7ulnfhuh4slix3armpj76teq56.png" width="97.5" height="93.5"><b>游戏音乐</b>
<div>
<p style="color:whitesmoke;font-style: oblique;display: flex;font-size: 1.4em; align-items: center;text-align: right;padding-top: 40px;padding-bottom: 10px;"><b>生命流</b></p>
<audio controls style="width: 61.8%;">
<source src="img/s.mp3" type="audio/mpeg">
<source src="sml.ogg" type="audio/ogg">
<embed height="50" width="100" src="img/s.mp3">
</audio>
<p style="color:whitesmoke;font-style: oblique;display: flex;font-size: 1.4em; align-items: center;text-align: right;padding-top: 40px;padding-bottom: 10px;"><b>Ready?</b></p>
<audio controls style="width: 61.8%;">
<source src="img/r.mp3" type="audio/mpeg">
<source src="r.ogg" type="audio/ogg">
<embed height="50" width="100" src="img/r.mp3">
</audio>
<p style="color:whitesmoke;font-style: oblique;display: flex;font-size: 1.4em; align-items: center;text-align: right;padding-top: 40px;padding-bottom: 10px;"><b>Renegade</b></p>
<audio controls style="width: 61.8%;">
<source src="img/w.mp3" type="audio/mpeg">
<source src="w.ogg" type="audio/ogg">
<embed height="50" width="100" src="img/w.mp3">
</audio>
<p style="color:whitesmoke;font-style: oblique;display: flex;font-size: 1.4em; align-items: center;text-align: right;padding-top: 40px;padding-bottom: 10px;"><b>Control's Wishes</b></p>
<audio controls style="width: 61.8%;">
<source src="img/c.mp3" type="audio/mpeg">
<source src="c.ogg" type="audio/ogg">
<embed height="50" width="100" src="img/c.mp3">
</audio>
</div>
<br>
<br>
<br>
<br>
<div id="sec5">
<p style="color:whitesmoke;font-style: oblique;font-size: 2em;display: flex; align-items: center;text-align: right;"><img src="https://patchwiki.biligame.com/images/arknights/8/87/mhjtmgekzgx8fkglq8hno053m5phgi6.png" width="97.5" height="93.5"><b>更多信息</b>
<p style="color:whitesmoke;display: flex;font-size: 1.4em; align-items: center;text-align: right;padding-top: 40px;padding-bottom: 10px;">请您对这款游戏、这个网站作出评价:</p>
<div class="div1" id="div1">
<span style="color:whitesmoke;font-size: 1.2em;text-align: center;"><b>昵称:</b></span><input type="text" id="user" name="user" style="width:61.8%; height: 45px;;">
<br>
<span style="color:whitesmoke;font-size: 1.2em;text-align: center;"><b>留言:</b></span><textarea id="lang" style="width:61.8%; height: 100px;;"></textarea><br><br>
<input type="button" value="提交评价" id="btn" style="cursor: pointer;font-size: 1.2em;size:200%">
</div>
</div>
<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}
function asdl(){
var age = prompt("该游戏分级为12+,请问您几岁?");
if (age >= 12) {
window.location.href ="https://apps.apple.com/cn/app/id1454663939", "_blank";
} else {
alert("谁家小孩?很抱歉,您未满12周岁,无法下载。");
};
}
function adl() {
var age = prompt("该游戏分级为12+,请问您几岁?");
if (age >= 12) {
window.open("https://ak.hypergryph.com/downloads/android_lastest", "_blank");
} else {
alert("谁家小孩?很抱歉,您未满12周岁,无法下载。");
}
}
const videos = document.querySelectorAll(".video");
const player = document.querySelector(".player");
for (let video of videos) {
video.addEventListener("click", function() {
document.querySelector(".active").classList.remove("active");
this.classList.add("active");
let src = this.getAttribute("data-src");
player.src = src;
player.classList.remove("show");
player.onloadeddata = function() {
// show the player
player.classList.add("show");
// play the video
player.play();
};
});
}
var user=document.getElementById('user');
var lang=document.getElementById('lang');
document.getElementById('btn').onclick=function(){
var cont=document.createElement('div');
cont.innerHTML='<p>'+user.value+':'+lang.value+'</p><hr>';
document.getElementById('div1').appendChild(cont);
user.value='';
lang.value='';
}
</script>
</body>
</html>