Scribd
Upload
466 views

HTML Code For Car Racing Game

html code for car racing game

Uploaded by

muryum29
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
466 views

HTML Code For Car Racing Game

html code for car racing game

Uploaded by

muryum29
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Car Racing Game</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

body {
font-family: Arial, sans-serif;
display: flex;
justify-content: center;
align-items: center;
background-color: #e0e0e0;
height: 100vh;
}

.game-container {
position: relative;
width: 500px;
height: 700px;
background-color: #222;
border: 2px solid #000;
overflow: hidden;
}

.car {
position: absolute;
bottom: 10px;
left: 50%;
width: 40px;
height: 80px;
background-color: red;
border-radius: 10px;
transform: translateX(-50%);
}

.obstacle {
position: absolute;
width: 40px;
height: 80px;
background-color: green;
border-radius: 10px;
top: -80px;
left: 50%;
transform: translateX(-50%);
}

.score {
position: absolute;
top: 10px;
left: 10px;
font-size: 20px;
color: white;
}

.game-over {
position: absolute;
top: 50%;
left: 50%;
font-size: 30px;
color: white;
transform: translate(-50%, -50%);
display: none;
}
</style>
</head>
<body>
<div class="game-container">
<div class="car" id="car"></div>
<div class="score" id="score">Score: 0</div>
<div class="game-over" id="gameOver">Game Over</div>
</div>

<script src="game.js"></script>
</body>
</html>

You might also like