Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 12 · 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.📝 Does <br> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
2. 2.🌈 Which colour of light is strongest in rgb(112, 238, 98)? (a) blue (b) red (c) green
3. 3.🎯 What kind of selector is #top? (a) an id selector (b) a class selector (c) an element selector
4. 4.📝 Which tag makes a big box for many lines of text? (a) <p> (b) <input> (c) <textarea> (d) <br>
5. 5.Which of these is true of a web server? (a) turns HTML into a page (b) hosts websites online (c) opens web pages for us (d) saves our .html files
6. 6.Which of these goes in the head? (a) <link rel="stylesheet"> (b) <img> (c) <ul> (d) <h1>
7. 7.🚀 What is the home page file of a website usually called? (a) main.png (b) start.js (c) index.html (d) home.css
8. 8.⚡ A JavaScript file usually ends with which extension? (a) .css (b) .jpg (c) .html (d) .js
9. 9.🔠 Which heading shows the BIGGEST text: <h4>, <h5>, <h1> or <h3>? (a) <h3> (b) <h1> (c) <h4> (d) <h5>
10. 10.🔢 When you open a web page, which comes FIRST? (a) DNS finds the server (b) the browser asks it (c) the browser shows it (d) you type the URL
11. 11.True or false: .card is an id selector. (a) False (b) True
12. 12.🖌️ Where does the text sit on its line?
    p {
      background-color: green;
      text-align: center;
      font-size: 12px;
      color: red;
    } (a) on the right (b) on the left (c) in the middle
13. 13.🌐 Which one stores a website’s files? (a) a web browser (b) a code editor (c) a web server
14. 14.True or false: <a href="a.html">Go</a> goes in script.js. (a) False (b) True
15. 15.Which colour pair is easy to read? (a) yellow on white (b) blue on purple (c) red on green (d) black on white
16. 16.✍️ Which property is set to bold in this rule?
    h1 {
      font-weight: bold;
      background-color: yellow;
      width: 300px;
      color: red;
    } (a) bold (b) font-weight (c) width (d) border
17. 17.🔗 Which tag makes a clickable link? (a) <p> (b) <img> (c) <link> (d) <a>
18. 18.📊 How many rows does this table have?
    <table>
      <tr><td>Orange</td><td>Litchi</td><td>Grapes</td><td>Litchi</td></tr>
      <tr><td>Jamun</td><td>Litchi</td><td>Papaya</td><td>Grapes</td></tr>
    </table>
19. 19.📋 Does this list show bullets or numbers?
    <ol>
      <li>Banana</li>
      <li>Grapes</li>
      <li>Orange</li>
    </ol> (a) numbers (b) bullets
20. 20.🎯 Which element does the selector #main style? (a) <h2 class="note"> (b) <h1 id="main"> (c) <h1 class="main"> (d) <h1 id="logo">
21. 21.🖼️ Which tag puts a picture on a page? (a) <p> (b) <img> (c) <a> (d) <pic>
22. 22.🔁 How many times does this code print “Well done”?
    for (let i = 1; i < 8; i++) {
      console.log("Well done");
    }
23. 23.💬 Which text will NOT show on the page?
    <p>My best friend</p>
    <!-- <p>Rain today</p> -->
    <p>Fun facts</p>
    <p>The red kite</p> (a) The red kite (b) Rain today (c) Fun facts (d) My best friend
24. 24.📝 On how many lines does the browser show this paragraph?
    <p>Rivers flow<br>Sky is blue<br>Birds sing<br>Kites fly high<br>Stars shine</p>
25. 25.True or false: “link text “click here”” makes the page harder to use. (a) True (b) False
26. 26.♿ What does good colour contrast mean? (a) only red text (b) many bright colours (c) text stands out clearly (d) no colours at all
27. 27.🔁 What is the LAST number this code prints?
    for (let i = 0; i < 5; i = i + 3) {
      console.log(i);
    }
28. 28.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="map.png" alt="Map of India" width="100"> (a) width (b) Map of India (c) Birthday cake (d) map.png
29. 29.🖌️ What colour is behind the letters?
    h1 {
      color: white;
      font-size: 32px;
      text-align: left;
      background-color: orange;
    } (a) white (b) green (c) orange
30. 30.🔢 In a basic web page file, which comes LAST? (a) </html> (b) </head> (c) </body> (d) <body>
31. 31.🌍 What finds the server for a domain name like example.com? (a) DNS (b) alt (c) HTML (d) CSS
32. 32.🌈 In #rrggbb, which colour do the last two digits give? (a) white (b) red (c) green (d) blue
33. 33.🔢 On a typical page, from top to bottom, what comes right after “<nav>”? (a) <footer> (b) <header> (c) <main>
34. 34.🔍 Which is the odd one out? (a) makes a form box (b) counts down a timer (c) makes headings and lists (d) puts a picture on a page
35. 35.✍️ How many declarations (property: value pairs) are in this rule?
    li {
      background-color: yellow;
      font-size: 20px;
      text-align: center;
    }
36. 36.🌈 Which hex code is blue? (a) #ff0000 (b) #00ffff (c) #00ff00 (d) #0000ff
37. 37.Which of these is an opening tag? (a) </li> (b) </title> (c) </p> (d) <li>
38. 38.🖼️ Which picture file does the browser load?
    <img src="map.png" alt="Map of India" width="50"> (a) dog.jpg (b) cake.jpg (c) Map of India (d) map.png
39. 39.🧭 Which semantic tag holds the logo and title? (a) <main> (b) <header> (c) <nav> (d) <footer>
40. 40.📱 The screen is 700px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (min-width: 600px) {
      p {
        font-size: 16px;
      }
    }

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