Quiz in HTML
? Simple HTML Quiz Example
Here's a basic HTML quiz you can use, with multiple-choice questions and JavaScript to check answers.
Example: HTML Quiz
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <title>HTML Quiz</title> <style> body { font-family: Arial, sans-serif; max-width: 600px; margin: 20px auto; } .question { margin-bottom: 15px; } </style></head><body> <h2>HTML Basics Quiz</h2> <form id="quizForm"> <div class="question"> <p>1. What does HTML stand for?</p> <label><input type="radio" name="q1" value="a"> Hyper Text Markup Language</label><br /> <label><input type="radio" name="q1" value="b"> Home Tool Markup Language</label><br /> <label><input type="radio" name="q1" value="c"> Hyperlinks and Text Markup Language</label> </div> <div class="question"> <p>2. Which tag is used to insert an image?</p> <label><input type="radio" name="q2" value="a"> <img></label><br /> <label><input type="radio" name="q2" value="b"> <image></label><br /> <label><input type="radio" name="q2" value="c"> <pic></label> </div> <div class="question"> <p>3. Which attribute is used to create a link?</p> <label><input type="radio" name="q3" value="a"> href</label><br /> <label><input type="radio" name="q3" value="b"> src</label><br /> <label><input type="radio" name="q3" value="c"> link</label> </div> <button type="button" onclick="checkAnswers()">Submit</button> </form> <p id="result"></p> <script> function checkAnswers() { const answers = { q1: 'a', q2: 'a', q3: 'a' }; let score = 0; const form = document.forms['quizForm']; for (const q in answers) { const userAnswer = form[q].value; if (userAnswer === answers[q]) { score++; } } document.getElementById('result').textContent = `You scored ${score} out of 3.`; } </script></body></html>How it works:
User selects answers for 3 questions.
Click Submit to see the score.
Simple JavaScript compares answers and displays result.
Want me to help you build a more advanced quiz with feedback or multiple pages?
