Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 265 · 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.📄 Where does <ul> go: in the head or in the body? (a) in the head (b) in the body
2. 2.📊 How many cells are in each row?
   <table>
     <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
     <tr><td>Grapes</td><td>Papaya</td><td>Guava</td><td>Jamun</td></tr>
   </table>
3. 3.✍️ Which property is set to red in this rule?
   .note {
     color: red;
     background-color: yellow;
     width: 300px;
   } (a) color (b) red (c) font-size (d) text-align
4. 4.🔗 Which address opens when you click this link?
   <a href="maths.html">Maths fun</a> (a) news.html (b) maths.html (c) Maths fun (d) art.html
5. 5.📊 Which tag makes one table row? (a) <td> (b) <th> (c) <tr> (d) <table>
6. 6.💬 Does the browser show comments on the page? (a) No (b) Yes
7. 7.🛡️ Should you share your password with your best friend? (a) No (b) Yes
8. 8.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="bus.jpg" alt="Our school bus" width="350"> (a) An old fort (b) Our school bus (c) bus.jpg (d) width
9. 9.⚖️ What colour is the text of this element?
   <h1 class="box" id="top">Hi</h1>
   CSS:
   #top { color: blue; }
   h1 { color: red; }
   .box { color: black; } (a) red (b) purple (c) blue (d) black
10. 10.📱 max-width: 600px applies when the screen is ___. (a) exactly 1000px (b) 600px or narrower (c) 600px or wider (d) turned off
11. 11.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 18px;
      }
    }
12. 12.🖼️ Which picture file does the browser load?
    <img src="kite.png" alt="A red kite" width="100"> (a) cake.jpg (b) map.png (c) A red kite (d) kite.png
13. 13.🚀 You change your code. What should you do to see the change? (a) switch off the PC (b) save and refresh (c) rename the folder (d) delete the file
14. 14.🌈 Which colour is #00ff00? (a) white (b) magenta (c) bright green (d) black
15. 15.🔐 Is password a strong or a weak password? (a) strong (b) weak
16. 16.♿ Does this help everyone, or make the page harder to use: images with no alt? (a) helps everyone (b) makes it harder
17. 17.🔁 Which loop repeats code a set number of times? (a) if (b) for (c) let (d) else
18. 18.📱 The screen is 700px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 24px;
      }
    }
19. 19.🔍 One closing tag is missing. Which one?
    <h2>Fun facts</h2>
    <p>Hello, world!</p>
    <b>Rain today (a) </b> (b) </p> (c) </h2> (d) </h1>
20. 20.🖼️ Does <img> need a closing tag? (a) Yes (b) No
21. 21.🔗 Which words do you click on?
    <a href="about.html">Art corner</a> (a) Art corner (b) School news (c) href (d) about.html
22. 22.💪 Which flexbox property lines boxes up across? (a) flex-direction (b) gap (c) display: flex (d) align-items
23. 23.🔁 How many numbers does this code print?
    for (let i = 0; i < 20; i = i + 2) {
      console.log(i);
    }
24. 24.Which of these is an opening tag? (a) <p> (b) </li> (c) </b> (d) </title>
25. 25.💪 Which justify-content value puts boxes in the middle? (a) flex-end (b) center (c) space-between (d) flex-start
26. 26.True or false: HTML on its own cannot show paragraphs. (a) True (b) False
27. 27.🔍 Which is the odd one out? (a) saves our .html files (b) colours code to help us (c) is where we type code (d) stores a website’s files
28. 28.Which of these is the border? (a) the text or picture (b) space outside the border (c) a solid or dotted edge (d) space inside the border
29. 29.🏷️ Is </title> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
30. 30.True or false: <tr> makes one table row. (a) True (b) False
31. 31.Which of these is an empty tag? (a) <b> (b) <title> (c) <br> (d) <p>
32. 32.🔠 How many headings are in this code?
    <h1>The red kite</h1>
    <h2>My pets</h2>
    <p>My best friend</p>
    <p>I love mangoes.</p>
33. 33.🌍 What is the protocol in this URL?
    https://school.example.in/news/today.html (a) http (b) /news/today.html (c) https (d) school.example.in
34. 34.💪 Which justify-content value packs boxes at the start? (a) space-between (b) flex-start (c) center (d) flex-end
35. 35.💬 Which text will NOT show on the page?
    <p>My best friend</p>
    <!-- <p>My pets</p> -->
    <p>Our school trip</p> (a) Our school trip (b) My best friend (c) My pets
36. 36.💬 How many paragraphs show on the page?
    <!-- <p>The red kite</p> -->
    <!-- <p>Our school trip</p> -->
    <p>Cricket is fun.</p>
    <!-- <p>I love mangoes.</p> -->
37. 37.⚡ What number does this code print?
    let a = 2;
    let b = 2;
    console.log(a * b);
38. 38.✍️ What is the selector in this CSS rule?
    p {
      padding: 8px;
      font-size: 20px;
      font-weight: bold;
      width: 300px;
    } (a) padding (b) 20px (c) .note (d) p
39. 39.🎯 What kind of selector is #logo? (a) a class selector (b) an element selector (c) an id selector
40. 40.📄 Which part holds everything you see on the page? (a) the head (b) the title (c) the doctype (d) the body

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