-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
103 lines (87 loc) · 4.03 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QuizMaster Hub</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<main class="main">
<header class="header">
<a href="#" class="logo">Quiz</a>
<nav class="navbar">
<a href="#" class="active">Home</a>
<a href="#">About</a>
<a href="#">Services</a>
<a href="#">Contact</a>
</nav>
</header>
<div class="container">
<section class="quiz-section">
<div class="quiz-box">
<h1>Quiz</h1>
<div class="quiz-header">
<span>QuizMaster Hub</span>
<span class="header-score">Score: 0/5</span>
</div>
<h2 class="question-text">What does HTML stand for?</h2>
<div class="option-list">
<div class="option">
<span>A. HyperText Management Language</span>
</div>
<div class="option">
<span>B. HyperText Model Language</span>
</div>
<div class="option">
<span>C. HyperText Markup Language</span>
</div>
<div class="option">
<span>D. HyperText Markup Level</span>
</div>
</div>
<div class="quiz-footer">
<span class="question-total">1 of 5 Questions</span>
<button class="next-btn">Next</button>
</div>
</div>
<div class="result-box">
<h2>Results!!</h2>
<div class="percentage-container">
<div class="circular-progress">
<span class="progress-value">0%</span>
</div>
<span class="score-text">Your Score 0 out of 5</span>
</div>
<div class="buttons">
<button class="tryAgain-btn">Try Again</button>
<button class="goHome-btn">Go To Home</button>
</div>
</div>
</section>
<section class="home">
<div class="home-content">
<h1>QuizMaster Hub</h1>
<p>Welcome to QuizMaster Hub, your ultimate destination for fun and engaging quizzes! Whether you're looking to test your knowledge, learn new facts, or compete with friends, QuizMaster Hub has it all. Explore a wide variety of quizzes across multiple categories, from general knowledge and trivia to specialized topics and educational content. Challenge others and climb the leaderboard to become the ultimate QuizMaster. Dive in and start your journey to quiz mastery today!
</p>
<button class="start-btn">Start Quiz</button>
</div>
</section>
</div>
</main>
<div class="popup-info">
<h2>Quiz Guide</h2>
<span class="info">1. The quiz consist of 5 question each question is compulsary</span>
<span class="info">2. no negative markings is there in quiz</span>
<span class="info">3. can give quiz anytime you want</span>
<span class="info">4. it consist of simple questions only</span>
<span class="info">5. you can cheat if you want</span>
<div class="btn-group">
<button class="info-btn exit-btn">Exit Quiz</button>
<a href="#" class="info-btn continue-btn">Continue</a>
</div>
</div>
<script src="questions.js"></script>
<script src="script.js"></script>
</body>
</html>