Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 740 · 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 pink on red easy or hard to read? (a) easy to read (b) hard to read
2. 2.🖼️ Which picture file does the browser load?
   <img src="cake.jpg" alt="Birthday cake" width="50"> (a) dog.jpg (b) Birthday cake (c) moon.png (d) cake.jpg
3. 3.🔍 Which is the odd one out? (a) makes headings and lists (b) makes a link (c) rounds box corners (d) puts a picture on a page
4. 4.🖼️ How many pixels wide is the picture drawn?
   <img src="cake.jpg" alt="Birthday cake" width="350">
5. 5.🔁 What is the LAST number this code prints?
   for (let i = 0; i < 9; i = i + 4) {
     console.log(i);
   }
6. 6.Which of these is padding? (a) the gap to other boxes (b) space outside the border (c) the gap round content (d) the line round the box
7. 7.🧭 Is <main> semantic or not semantic? (a) semantic (b) not semantic
8. 8.⚡ What number does this code print?
   let a = 10;
   let b = 11;
   console.log(a * b);
9. 9.📊 How many rows does this table have?
   <table>
     <tr><th>Name</th><th>Fruit</th></tr>
     <tr><td>Orange</td><td>Banana</td></tr>
   </table>
10. 10.⚡ What does this code print? (Look at the quotes!)
    let x = "5";
    let y = 5;
    console.log(x + y); (a) Error (b) 10 (c) 55
11. 11.🔢 To build and share your first web page, what comes right after “write the HTML”? (a) plan what to show (b) publish it online (c) add CSS styles (d) test in a browser
12. 12.True or false: JavaScript shows a pop-up message. (a) False (b) True
13. 13.✍️ In color: blue; which part is the value? (a) blue (b) : (c) ; (d) color
14. 14.🔠 Which heading shows the BIGGEST text: <h3>, <h2>, <h6> or <h1>? (a) <h1> (b) <h2> (c) <h6> (d) <h3>
15. 15.⚖️ What colour is the text of this element?
    <h1 class="red" id="main">Hi</h1>
    CSS:
    #main { color: black; }
    .red { color: purple; } (a) purple (b) black (c) yellow (d) blue
16. 16.📋 How many items does this list show?
    <ul>
      <li>Papaya</li>
      <li>Litchi</li>
      <li>Banana</li>
    </ul>
17. 17.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 16px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 14px;
      }
    }
18. 18.True or false: <meta> is an empty tag. (a) False (b) True
19. 19.Which of these is safe to do online? (a) type a password on http (b) ask before downloading (c) share your password (d) download from pop-ups
20. 20.💬 Does the browser show comments on the page? (a) Yes (b) No
21. 21.🏷️ Which is the closing tag for <strong>? (a) <\strong> (b) <strong/> (c) </strong> (d) <strong>
22. 22.Which of these is true of a web server? (a) sends pages over the net (b) colours code to help us (c) is where we type code (d) saves our .html files
23. 23.True or false: a web server hosts websites online. (a) False (b) True
24. 24.✍️ Which property is set to center in this rule?
    li {
      text-align: center;
      margin: 10px;
      padding: 8px;
    } (a) margin (b) background-color (c) center (d) text-align
25. 25.🔠 Which heading shows the BIGGEST text: <h1>, <h5>, <h4> or <h3>? (a) <h1> (b) <h4> (c) <h3> (d) <h5>
26. 26.💬 Why do coders write comments? (a) to make links (b) to show pictures (c) to add colour (d) to leave notes
27. 27.True or false: in <img>, src names the picture file. (a) True (b) False
28. 28.True or false: <input type="checkbox"> lets you tick many. (a) False (b) True
29. 29.True or false: <header> holds the logo and title. (a) False (b) True
30. 30.True or false: the URL scrambles data on its way. (a) False (b) True
31. 31.🔠 Which tag is the least important heading? (a) <h3> (b) <h6> (c) <h1> (d) <p>
32. 32.🖌️ How big is the text, in px?
    h2 {
      background-color: green;
      color: white;
      font-size: 36px;
      text-align: left;
    }
33. 33.🚀 Which tag loads script.js into a page? (a) <js src="script.js"> (b) <script src="script.js"> (c) <link script.js> (d) <a href="script.js">
34. 34.🎨 Which attribute adds CSS inside one tag? (a) style (b) src (c) alt (d) href
35. 35.True or false: <ul><li>Art</li></ul> goes in index.html. (a) True (b) False
36. 36.True or false: the content is a solid or dotted edge. (a) True (b) False
37. 37.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 230px;
      padding: 20px;
      border: 3px solid black;
      margin: 0px;
    }
38. 38.Which colour pair is hard to read? (a) blue on purple (b) yellow on black (c) white on black (d) white on dark blue
39. 39.What does justify-content: flex-end do? (a) packs boxes at the start (b) puts boxes in the middle (c) equal gaps, none at ends (d) packs boxes at the end
40. 40.🏷️ Which is the closing tag for <b>? (a) <b/> (b) </b> (c) <b> (d) <\b>

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