Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 749 · 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.♿ Is this heading order correct (no level skipped)?
   <h1> → <h2> → <h2> → <h2> (a) No (b) Yes
2. 2.True or false: <ul> shows bullet points. (a) False (b) True
3. 3.What does justify-content: flex-start do? (a) packs boxes at the end (b) equal gaps, none at ends (c) packs boxes at the start (d) puts boxes in the middle
4. 4.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is a game (b) the site is free (c) the site is fast (d) the data is scrambled
5. 5.🔁 What does this code print?
   let temp = 30;
   if (temp > 38) {
     console.log("Hot");
   } else {
     console.log("Cool");
   } (a) Hot (b) Cool
6. 6.🔠 How many headings are in this code?
   <h1>Rain today</h1>
   <p>Our school trip</p>
   <p>My pets</p>
7. 7.📄 Can HTML on its own run a game loop? (a) No (b) Yes
8. 8.🖼️ Which tag puts a picture on a page? (a) <pic> (b) <p> (c) <a> (d) <img>
9. 9.📄 Where does <style> go: in the head or in the body? (a) in the body (b) in the head
10. 10.🖌️ Which CSS property sets the letter colour? (a) font-weight (b) color (c) font-family (d) text-align
11. 11.🖼️ Which picture file does the browser load?
    <img src="dog.jpg" alt="A happy dog" width="300"> (a) dog.jpg (b) A happy dog (c) bus.jpg (d) moon.png
12. 12.🌈 Which colour of light is strongest in rgb(124, 21, 172)? (a) blue (b) green (c) red
13. 13.🏷️ What does a closing tag have that an opening tag does not? (a) a slash / (b) a dollar $ (c) a dot . (d) a hash #
14. 14.🌍 Which one stores the site’s files? (a) the URL (b) HTTPS (c) the server (d) the browser
15. 15.🧩 Which language puts a picture on a page? (a) JavaScript (b) HTML (c) CSS
16. 16.🔗 Which words do you click on?
    <a href="about.html">Play games</a> (a) About us (b) about.html (c) href (d) Play games
17. 17.🏷️ Which is the closing tag for <h3>? (a) <h3/> (b) <\h3> (c) <h3> (d) </h3>
18. 18.📋 Does this list show bullets or numbers?
    <ul>
      <li>Grapes</li>
      <li>Orange</li>
      <li>Litchi</li>
    </ul> (a) bullets (b) numbers
19. 19.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th></tr>
      <tr><td>Papaya</td><td>Orange</td></tr>
      <tr><td>Litchi</td><td>Litchi</td></tr>
    </table>
20. 20.⚖️ Two rules with the same selector set a colour. Which one wins? (a) the shorter one (b) the later one (c) neither (d) the first one
21. 21.✍️ What is the selector in this CSS rule?
    body {
      color: red;
      margin: 10px;
    } (a) color (b) body (c) 10px (d) .box
22. 22.🔁 What is the LAST number this code prints?
    for (let i = 0; i < 7; i = i + 2) {
      console.log(i);
    }
23. 23.⚖️ What colour is the text of this element?
    <h1 class="big" id="intro">Hi</h1>
    CSS:
    h1 { color: red; }
    h1 { color: white; } (a) white (b) orange (c) red (d) yellow
24. 24.🧩 Which language rounds box corners? (a) JavaScript (b) HTML (c) CSS
25. 25.True or false: the content is the line round the box. (a) False (b) True
26. 26.🌈 What is the biggest number one colour can have in rgb()? (a) 1000 (b) 99 (c) 100 (d) 255
27. 27.📦 In the box model, which part is the gap round content? (a) border (b) margin (c) padding (d) content
28. 28.🔗 Which words do you click on?
    <a href="about.html">Visit the site</a> (a) href (b) about.html (c) Visit the site (d) Maths fun
29. 29.🌗 Is pink on red easy or hard to read? (a) hard to read (b) easy to read
30. 30.🖼️ Does <img> need a closing tag? (a) No (b) Yes
31. 31.✍️ How many declarations (property: value pairs) are in this rule?
    body {
      text-align: center;
      background-color: yellow;
      font-style: italic;
      margin: 10px;
    }
32. 32.🔗 Where does this link open?
    <a href="https://example.com" target="_blank">Contact us</a> (a) in the same tab (b) in a new tab
33. 33.🖌️ How big is the text, in px?
    li {
      font-size: 28px;
      text-align: right;
      background-color: green;
      color: red;
    }
34. 34.📝 Which input type hides what you type? (a) email (b) text (c) password (d) checkbox
35. 35.True or false: a web server stores a website’s files. (a) False (b) True
36. 36.📝 Which input type picks a day? (a) date (b) email (c) text (d) number
37. 37.⚖️ What colour is the text of this element?
    <h1 class="star" id="end">Hi</h1>
    CSS:
    .star { color: yellow; }
    h1 { color: red; }
    #end { color: black; } (a) green (b) red (c) black (d) yellow
38. 38.🎯 Which element does the selector .big style? (a) <li id="big"> (b) <li class="red"> (c) <li class="big"> (d) <div class="box">
39. 39.📝 Does <meta> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
40. 40.🔢 On a typical page, from top to bottom, which comes first: “<nav>” or “<footer>”? (a) <footer> (b) <nav>

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