Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 493 · 40 questions

Code tip (Read it like a browser): Find the topic: HTML, CSS, JavaScript or how the web works. Read the code line by line, the way a browser would. For sums and loops, write each step down and check it again.

1. 1.🔗 Which code links to about.html? (a) <link about.html> (b) <a alt="about.html"> (c) <a src="about.html"> (d) <a href="about.html">
2. 2.🔢 In a basic web page file, which comes first: “</head>” or “<html>”? (a) </head> (b) <html>
3. 3.💬 Does the browser show comments on the page? (a) No (b) Yes
4. 4.🔍 Which is the odd one out? (a) sends pages over the net (b) stores a website’s files (c) hosts websites online (d) opens web pages for us
5. 5.🔁 How many times does this code print “Hi”?
   for (let i = 2; i <= 6; i++) {
     console.log("Hi");
   }
6. 6.🔗 Which address opens when you click this link?
   <a href="about.html">Play games</a> (a) https://example.com (b) Play games (c) about.html (d) contact.html
7. 7.🔗 Which address opens when you click this link?
   <a href="about.html">About us</a> (a) contact.html (b) About us (c) about.html (d) https://example.com
8. 8.True or false: <caption> makes one table row. (a) False (b) True
9. 9.💪 Which flexbox property spaces boxes along a row? (a) align-items (b) display: flex (c) gap (d) justify-content
10. 10.🌐 Which one opens web pages for us? (a) a code editor (b) a web browser (c) a web server
11. 11.True or false: .box { padding: 8px; } goes in style.css. (a) True (b) False
12. 12.⚖️ Which selector is the weakest? (a) an element selector (b) a class selector (c) an id selector
13. 13.📝 Which tag holds a whole form? (a) <input> (b) <table> (c) <form> (d) <ol>
14. 14.📊 Are <th> cells shown bold and centred by default? (a) No (b) Yes
15. 15.True or false: h1 { font-size: 32px; } goes in script.js. (a) True (b) False
16. 16.🌍 Which one scrambles data on its way? (a) the server (b) HTTPS (c) the URL (d) the browser
17. 17.⚡ What does this code show?
    let name = "Arjun";
    alert("Hello, " + name + "!"); (a) name (b) Hello, Arjun! (c) Arjun (d) Hello, name!
18. 18.🔢 On a typical page, from top to bottom, which comes FIRST? (a) <header> (b) <main> (c) <footer> (d) <nav>
19. 19.True or false: <p> is an empty tag. (a) True (b) False
20. 20.💬 How does an HTML comment start? (a) <!-- (b) # (c) // (d) /*
21. 21.📝 How many paragraphs does this code make?
    <p>Hello, world!</p>
    <h2>My pets</h2>
    <h2>Cricket is fun.</h2>
    <h2>My best friend</h2>
    <p>I love mangoes.</p>
    <h2>I love mangoes.</h2>
22. 22.💪 Which flexbox property sets space between boxes? (a) justify-content (b) flex-direction (c) display: flex (d) gap
23. 23.🧩 Which language changes the text size? (a) JavaScript (b) CSS (c) HTML
24. 24.Which of these is a weak password? (a) S0lar!Pen#8 (b) Mango#Kite29! (c) Rain#Drop_42! (d) password
25. 25.🔁 How many numbers does this code print?
    for (let i = 0; i < 6; i = i + 3) {
      console.log(i);
    }
26. 26.True or false: <h1> has a closing tag. (a) True (b) False
27. 27.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 140px;
      justify-content: flex-start;
    }
    Inside are 2 boxes, each 50px wide (no margins).
28. 28.⚖️ What colour is the text of this element?
    <p class="menu" id="hero">Hi</p>
    CSS:
    #hero { color: green; }
    #hero { color: white; } (a) green (b) red (c) white (d) black
29. 29.📱 The screen is 320px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 14px;
      }
    } (a) No (b) Yes
30. 30.🖌️ How big is the text, in px?
    p {
      font-size: 24px;
      color: red;
      background-color: orange;
      text-align: left;
    }
31. 31.🖼️ Which picture file does the browser load?
    <img src="moon.png" alt="The full moon" width="50"> (a) fort.jpg (b) bus.jpg (c) moon.png (d) The full moon
32. 32.🌍 What is the protocol in this URL?
    https://www.example.net/maths/tables.html (a) http (b) /maths/tables.html (c) https (d) www.example.net
33. 33.💪 Which justify-content value equal gaps, none at ends? (a) flex-end (b) center (c) flex-start (d) space-between
34. 34.True or false: in <img>, height is read by screen readers. (a) False (b) True
35. 35.🔠 How many headings are in this code?
    <h1>I love mangoes.</h1>
    <p>I love mangoes.</p>
    <h2>Fun facts</h2>
    <p>The red kite</p>
36. 36.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="kite.png" alt="A red kite" width="100"> (a) kite.png (b) width (c) Map of India (d) A red kite
37. 37.🌈 In #rrggbb, which colour do the first two digits give? (a) black (b) red (c) blue (d) green
38. 38.🌐 Which one is where we type code? (a) a web server (b) a code editor (c) a web browser
39. 39.🖼️ Which picture file does the browser load?
    <img src="kite.png" alt="A red kite" width="250"> (a) kite.png (b) map.png (c) A red kite (d) cake.jpg
40. 40.♿ Does this help everyone, or make the page harder to use: colour as the only clue? (a) helps everyone (b) makes it harder

Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids