Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 501 · 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 text will NOT show on the page?
   <!-- <p>Fun facts</p> -->
   <p>Hello, world!</p>
   <p>Cricket is fun.</p> (a) Cricket is fun. (b) Fun facts (c) Hello, world!
2. 2.🔍 Which line is missing its closing tag?
   line 1: <h2>Cricket is fun.
   line 2: <strong>I love mangoes.</strong>
   line 3: <h1>The red kite</h1> (a) line 2 (b) line 1 (c) line 3
3. 3.True or false: HTML on its own cannot make a form. (a) False (b) True
4. 4.🖼️ Which tag puts a picture on a page? (a) <a> (b) <pic> (c) <p> (d) <img>
5. 5.🧩 Which language puts a picture on a page? (a) HTML (b) CSS (c) JavaScript
6. 6.🌈 How many pairs of hex digits are in a colour like #ff8800? (a) 2 (b) 4 (c) 3 (d) 6
7. 7.🔁 What does this code print?
   let score = 14;
   if (score >= 10) {
     console.log("You win");
   } else {
     console.log("Play again");
   } (a) Play again (b) You win
8. 8.📱 The screen is 700px wide. Does the rule inside @media apply?
   p {
     font-size: 12px;
   }
   @media (min-width: 768px) {
     p {
       font-size: 20px;
     }
   } (a) No (b) Yes
9. 9.Which of these is true of <main>? (a) holds a news story (b) helps you move around (c) holds a side box of tips (d) holds the main content
10. 10.📊 Which tag makes a heading cell? (a) <tr> (b) <td> (c) <caption> (d) <th>
11. 11.🔗 Which words do you click on?
    <a href="https://example.com">Contact us</a> (a) https://example.com (b) href (c) Visit the site (d) Contact us
12. 12.🔁 What does this code print?
    let score = 12;
    if (score > 6) {
      console.log("You win");
    } else {
      console.log("Play again");
    } (a) You win (b) Play again
13. 13.🔍 One closing tag is missing. Which one?
    <b>Hello, world!</b>
    <u>My best friend
    <h3>Our school trip</h3> (a) </h3> (b) </h1> (c) </u> (d) </b>
14. 14.🏷️ HTML marks up text using ___. (a) pixels (b) wires (c) tags (d) keys
15. 15.⚡ What number does this code print?
    let coins = 21;
    coins = coins + 19;
    coins = coins - 6;
    console.log(coins);
16. 16.💬 Which text will NOT show on the page?
    <p>Fun facts</p>
    <p>Our school trip</p>
    <!-- <p>Cricket is fun.</p> -->
    <p>The red kite</p> (a) Fun facts (b) The red kite (c) Cricket is fun. (d) Our school trip
17. 17.True or false: in <img>, src names the picture file. (a) False (b) True
18. 18.🌈 Which colour of light is strongest in rgb(13, 181, 112)? (a) red (b) blue (c) green
19. 19.🖼️ Which picture file does the browser load?
    <img src="moon.png" alt="The full moon" width="400"> (a) fort.jpg (b) bus.jpg (c) moon.png (d) The full moon
20. 20.⚖️ What colour is the text of this element?
    <h1 class="red" id="hero">Hi</h1>
    CSS:
    #hero { color: purple; }
    #hero { color: red; } (a) red (b) white (c) purple (d) black
21. 21.✍️ How does a CSS comment start? (a) <!-- (b) # (c) /* (d) //
22. 22.📱 The screen is 414px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 16px;
      }
    } (a) No (b) Yes
23. 23.⚖️ What colour is the text of this element?
    <h2 class="note" id="top">Hi</h2>
    CSS:
    #top { color: orange; }
    #top { color: red; } (a) red (b) blue (c) orange (d) purple
24. 24.Which of these is true of a code editor? (a) stores a website’s files (b) answers page requests (c) is where we type code (d) has an address bar
25. 25.True or false: <li> shows bullet points. (a) False (b) True
26. 26.True or false: <caption> gives the table a title. (a) True (b) False
27. 27.🔗 Where does this link open?
    <a href="https://example.com" target="_blank">Play games</a> (a) in a new tab (b) in the same tab
28. 28.🔠 Which heading shows the SMALLEST text: <h1>, <h3>, <h6> or <h5>? (a) <h1> (b) <h6> (c) <h5> (d) <h3>
29. 29.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="fort.jpg" alt="An old fort" width="200"> (a) An old fort (b) width (c) fort.jpg (d) A tiger asleep
30. 30.🎯 Which element does the selector h1 style? (a) <div id="hero"> (b) <li class="big"> (c) <h1 class="big"> (d) <h2>
31. 31.What does justify-content: space-between do? (a) equal gaps, none at ends (b) packs boxes at the end (c) puts boxes in the middle (d) packs boxes at the start
32. 32.♿ Does this help everyone, or make the page harder to use: write clear link text? (a) makes it harder (b) helps everyone
33. 33.🖼️ Why do we add alt text to an image? (a) to make it bigger (b) to load it faster (c) to colour it (d) to describe the image
34. 34.🔍 One closing tag is missing. Which one?
    <u>Hello, world!</u>
    <em>The red kite
    <b>My best friend</b> (a) </em> (b) </p> (c) </b> (d) </u>
35. 35.🚀 Which file should this code go in: <p>Hello!</p> (a) index.html (b) script.js (c) style.css
36. 36.Which of these is an empty tag? (a) <p> (b) <title> (c) <hr> (d) <ul>
37. 37.🌍 What finds the server for a domain name like example.com? (a) HTML (b) CSS (c) DNS (d) alt
38. 38.🧭 Who is helped most by semantic tags? (a) nobody (b) only the printer (c) screen-reader users (d) only the server
39. 39.🎯 Which element does the selector #main style? (a) <span class="main"> (b) <span id="logo"> (c) <p class="box"> (d) <span id="main">
40. 40.📦 In the box model, which part is space inside the border? (a) margin (b) border (c) content (d) padding

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