Scribd
Upload
4 views

index.html

The document is an HTML template for a Tic Tac Toe game, featuring sections for player name input and the game interface. It includes a form for entering player names, a grid for the game, and buttons for starting and restarting the game. The game also has a popup to display the winner's name.

Uploaded by

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

index.html

The document is an HTML template for a Tic Tac Toe game, featuring sections for player name input and the game interface. It includes a form for entering player names, a grid for the game, and buttons for starting and restarting the game. The game also has a popup to display the winner's name.

Uploaded by

ryash8507
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as RTF, 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>Tic Tac Toe Game</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>

<!-- Player Name Input Section -->


<div id="name-input-section" class="name-input-section">
<h1>Enter Player Names</h1>
<form id="name-form">
<div>
<label for="player1">Player 1 (X):</label>
<input type="text" id="player1" required placeholder="Enter Player
1's name">
</div>
<div>
<label for="player2">Player 2 (O):</label>
<input type="text" id="player2" required placeholder="Enter Player
2's name">
</div>
<button type="submit" id="start-btn">Start Game</button>
</form>
</div>

<!-- Game Section -->


<div class="game-container" id="game-container" style="display:none;">
<h1>Tic Tac Toe</h1>
<div id="winner-popup" class="winner-popup">
<p id="winner-name"></p>
<button id="close-popup" class="close-popup">Close</button>
</div>
<div class="grid">
<div class="cell" id="cell-0"></div>
<div class="cell" id="cell-1"></div>
<div class="cell" id="cell-2"></div>
<div class="cell" id="cell-3"></div>
<div class="cell" id="cell-4"></div>
<div class="cell" id="cell-5"></div>
<div class="cell" id="cell-6"></div>
<div class="cell" id="cell-7"></div>
<div class="cell" id="cell-8"></div>
</div>
<button id="restart-btn" class="restart-btn">Restart Game</button>
</div>

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

You might also like