Pygame_Project/game.html

150 lines
4.5 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Game - Tanks 2D</title>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Montserrat', sans-serif;
margin: 0;
padding: 0;
background-color: #f0f0f0;
color: #333;
}
nav {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 50px;
background-color: #333;
padding: 10px;
display: flex;
align-items: center;
justify-content: space-between;
z-index: 1000;
}
.logo img {
max-height: 40px; /* Уменьшенный размер логотипа */
}
nav ul {
list-style-type: none;
margin: 0;
padding: 0;
text-align: center;
}
nav ul li {
display: inline;
margin-left: 10px; /* Уменьшенный отступ между пунктами меню */
}
nav ul li a {
color: #fff;
text-decoration: none;
padding: 8px 15px; /* Уменьшенные внутренние отступы в пунктах меню */
transition: background-color 0.3s;
}
nav ul li a:hover {
background-color: #555;
}
.container {
max-width: 800px;
margin: 100px auto 20px;
padding: 20px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
text-align: center;
}
h1 {
font-size: 48px;
font-weight: bold;
margin-bottom: 20px;
}
img {
max-width: 100%;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
margin-top: 20px;
}
p {
font-size: 18px;
line-height: 1.6;
text-align: left;
margin-bottom: 20px;
}
.download-link {
display: inline-block;
padding: 10px 20px;
background-color: #007bff;
color: #fff;
text-decoration: none;
border-radius: 5px;
transition: background-color 0.3s;
}
.download-link:hover {
background-color: #0056b3;
}
</style>
</head>
<body>
<nav>
<div class="logo">
<a href="/"><img src="https://cdn.discordapp.com/attachments/704651653873139803/1233880220004519986/Screenshot_2024-04-27_233856-removebg-preview.png?ex=662eb400&is=662d6280&hm=518bf12af052c5268492e81d64f8957eea1d6163b3c8fe28c3e8a69758169263&" alt="Tanki Logo"></a>
</div>
<ul>
<li><a href="/about">About</a></li>
<li><a href="/game">Game</a></li>
<li><a href="/link">Link</a></li>
</ul>
</nav>
<div class="container">
<h1>Tanks 2D</h1>
<img src="https://img.poki.com/cdn-cgi/image/quality=78,width=314,height=314,fit=cover,f=auto/2fc66b5540735bef2565f422131519d8.png" alt="Tanks 2D Screenshot">
<p>
Tanks 2D is an action-packed game where you control a tank and battle against other tanks in various environments.
The game features multiple levels, unique weapons, and challenging obstacles.
As you progress, you unlock new tanks and upgrades to enhance your gameplay experience.
</p>
<h2>Key Features</h2>
<p>
- Fast-paced 2D tank battles<br>
- Unique weapons and upgrades<br>
- Various maps and environments<br>
- Multiplayer modes and special events<br>
</p>
<h2>How to Play</h2>
<p>
To start playing Tanks 2D, download the game using the link below and follow the instructions to install it.
You can play single-player or join multiplayer battles to test your skills against other players.
</p>
<a href="/download" class="download-link">Download Tanks 2D</a>
</div>
<script>
document.querySelector('.logo').addEventListener('click', function() {
window.location.href = '/';
});
</script>
</body>
</html>