Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 256 · 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 heading shows the SMALLEST text: <h3>, <h6>, <h2> or <h4>? (a) <h6> (b) <h2> (c) <h4> (d) <h3>
2. 2.✍️ What value is given to padding in this rule?
   h2 {
     margin: 10px;
     padding: 8px;
     text-align: center;
     border: 2px solid;
   } (a) 8px (b) bold (c) 2px solid (d) padding
3. 3.True or false: let score = 0; goes in index.html. (a) False (b) True
4. 4.Which colour pair is hard to read? (a) white on dark blue (b) red on green (c) black on white (d) yellow on black
5. 5.True or false: HTML gives the page structure. (a) True (b) False
6. 6.♿ Does this help everyone, or make the page harder to use: tiny grey text? (a) helps everyone (b) makes it harder
7. 7.🌍 What is the path in this URL?
   https://kids.example.org/about.html (a) kids.example.org (b) /maths/tables.html (c) https (d) /about.html
8. 8.🎯 Which element does the selector #hero style? (a) <span id="hero"> (b) <span id="top"> (c) <span class="hero"> (d) <p class="menu">
9. 9.🌈 Which colour of light is strongest in rgb(174, 29, 50)? (a) green (b) blue (c) red
10. 10.🖌️ What colour is behind the letters?
    li {
      background-color: green;
      color: red;
      text-align: center;
      font-size: 36px;
    } (a) yellow (b) red (c) green
11. 11.True or false: <ul> shows bullet points. (a) True (b) False
12. 12.🌈 Which colour is rgb(0, 255, 0)? (a) yellow (b) bright green (c) white (d) magenta
13. 13.🔁 What does this code print?
    let temp = 21;
    if (temp > 39) {
      console.log("Hot");
    } else {
      console.log("Cool");
    } (a) Cool (b) Hot
14. 14.✍️ CSS declarations go inside which brackets? (a) { } (b) ( ) (c) [ ] (d) < >
15. 15.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 120px;
      padding: 5px;
      border: 4px solid black;
      margin: 20px;
    }
16. 16.🌐 Which one shows line numbers? (a) a web browser (b) a code editor (c) a web server
17. 17.🖼️ How many pixels wide is the picture drawn?
    <img src="cake.jpg" alt="Birthday cake" width="150">
18. 18.🔢 On a typical page, from top to bottom, which comes first: “<nav>” or “<footer>”? (a) <footer> (b) <nav>
19. 19.♿ Which link text is clearest? (a) here (b) click here (c) Read the fruit facts (d) link
20. 20.🔢 When you open a web page, what comes right after “DNS finds the server”? (a) the browser shows it (b) the browser asks it (c) the server sends files (d) you type the URL
21. 21.📄 Where does the text of <title> appear? (a) at the bottom (b) nowhere (c) on the browser tab (d) in a big heading
22. 22.📝 Which input type lets you pick only one? (a) text (b) email (c) checkbox (d) radio
23. 23.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 10; i++) {
      total = total + i;
    }
    console.log(total);
24. 24.🏷️ HTML marks up text using ___. (a) wires (b) tags (c) keys (d) pixels
25. 25.🔁 How many times does this code print “Hello”?
    for (let i = 2; i <= 9; i++) {
      console.log("Hello");
    }
26. 26.🔠 How many headings are in this code?
    <h1>The red kite</h1>
    <h3>Our school trip</h3>
    <h2>Cricket is fun.</h2>
    <h3>My pets</h3>
    <h3>Our school trip</h3>
27. 27.📄 Can HTML on its own show paragraphs? (a) Yes (b) No
28. 28.💪 Which justify-content value packs boxes at the end? (a) flex-end (b) space-between (c) flex-start (d) center
29. 29.🧩 Which language changes the page live? (a) JavaScript (b) HTML (c) CSS
30. 30.✍️ What value is given to background-color in this rule?
    li {
      background-color: yellow;
      font-style: italic;
    } (a) yellow (b) background-color (c) 10px (d) 8px
31. 31.🛡️ A pop-up says you won a prize and asks for your password. What do you do? (a) click it twice (b) share it with friends (c) close it, tell an adult (d) type the password
32. 32.🔢 When you open a web page, what comes right after “the server sends files”? (a) the browser asks it (b) DNS finds the server (c) you type the URL (d) the browser shows it
33. 33.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th></tr>
      <tr><td>Jamun</td><td>Grapes</td></tr>
      <tr><td>Orange</td><td>Mango</td></tr>
      <tr><td>Jamun</td><td>Jamun</td></tr>
    </table>
34. 34.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 280px;
      justify-content: center;
    }
    Inside are 3 boxes, each 80px wide (no margins).
35. 35.📋 Which list shows the steps of a recipe best? (a) <ul> (b) <hr> (c) <ol> (d) <br>
36. 36.⚡ Which JavaScript word runs code when true? (a) for (b) console.log() (c) if (d) let
37. 37.💬 Which text will NOT show on the page?
    <p>Our school trip</p>
    <p>The red kite</p>
    <!-- <p>Fun facts</p> -->
    <p>My best friend</p> (a) My best friend (b) The red kite (c) Our school trip (d) Fun facts
38. 38.🔍 Which line is missing its closing tag?
    line 1: <p>Cricket is fun.</p>
    line 2: <h3>Good morning!
    line 3: <em>Fun facts</em> (a) line 3 (b) line 2 (c) line 1
39. 39.🖼️ Which tag puts a picture on a page? (a) <img> (b) <p> (c) <pic> (d) <a>
40. 40.🖼️ Which picture file does the browser load?
    <img src="moon.png" alt="The full moon" width="100"> (a) moon.png (b) fort.jpg (c) bus.jpg (d) The full moon

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