Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 733 · 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 dark grey on white easy or hard to read? (a) easy to read (b) hard to read
2. 2.🖌️ What colour is behind the letters?
   p {
     background-color: white;
     font-size: 40px;
     color: yellow;
     text-align: center;
   } (a) purple (b) yellow (c) white
3. 3.💪 Which justify-content value packs boxes at the end? (a) flex-end (b) space-between (c) center (d) flex-start
4. 4.🌍 Which one is the page’s address? (a) the URL (b) the browser (c) HTTPS (d) the server
5. 5.🖼️ Which picture file does the browser load?
   <img src="dog.jpg" alt="A happy dog" width="350"> (a) bus.jpg (b) dog.jpg (c) moon.png (d) A happy dog
6. 6.📝 Does <title> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
7. 7.True or false: <caption> holds the whole table. (a) False (b) True
8. 8.✍️ Which sign ends each CSS declaration? (a) ; (b) . (c) : (d) ,
9. 9.📱 Responsive design means a page ___. (a) is only for laptops (b) never changes (c) fits every screen (d) has no pictures
10. 10.Which of these is the border? (a) space inside the border (b) space outside the border (c) the text or picture (d) a solid or dotted edge
11. 11.📄 Where does <img> go: in the head or in the body? (a) in the head (b) in the body
12. 12.🌍 What do we call the computer that stores a website? (a) a server (b) a mouse (c) a printer (d) a keyboard
13. 13.🔢 When you open a web page, which comes FIRST? (a) you type the URL (b) the browser asks it (c) the server sends files (d) DNS finds the server
14. 14.True or false: <input type="checkbox"> lets you tick many. (a) False (b) True
15. 15.🔁 How many numbers does this code print?
    for (let i = 0; i < 8; i = i + 4) {
      console.log(i);
    }
16. 16.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 140px;
      padding: 5px;
      border: 4px solid black;
      margin: 20px;
    }
17. 17.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 450px;
      justify-content: flex-start;
    }
    Inside are 4 boxes, each 100px wide (no margins).
18. 18.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 6px;
      }
    }
19. 19.Which of these does HTML do? (a) gives the page structure (b) sets colours and fonts (c) adds space around boxes (d) lays out the page
20. 20.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 90px;
      padding: 5px;
      border: 1px solid black;
      margin: 5px;
    }
21. 21.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 170px;
      padding: 10px;
      border: 5px solid black;
      margin: 5px;
    }
22. 22.💬 How many paragraphs show on the page?
    <!-- <p>Rain today</p> -->
    <p>I love mangoes.</p>
    <p>My pets</p>
    <!-- <p>Cricket is fun.</p> -->
    <p>Our school trip</p>
23. 23.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 110px;
      padding: 20px;
      border: 2px solid black;
      margin: 0px;
    }
24. 24.Which of these is true of a code editor? (a) hosts websites online (b) shows pages from the web (c) stores a website’s files (d) colours code to help us
25. 25.🔠 Which heading shows the SMALLEST text: <h6>, <h5>, <h1> or <h4>? (a) <h5> (b) <h1> (c) <h4> (d) <h6>
26. 26.🌍 Which one asks for a web page? (a) the browser (b) the server (c) HTTPS (d) the URL
27. 27.💬 How many paragraphs show on the page?
    <p>Fun facts</p>
    <!-- <p>Cricket is fun.</p> -->
    <p>The red kite</p>
    <p>My best friend</p>
28. 28.✍️ CSS declarations go inside which brackets? (a) { } (b) < > (c) [ ] (d) ( )
29. 29.🚀 Where in index.html does the link to style.css go? (a) after </html> (b) inside a <p> (c) in the head (d) in the footer
30. 30.🔗 Which address opens when you click this link?
    <a href="art.html">Maths fun</a> (a) Maths fun (b) quiz.html (c) art.html (d) news.html
31. 31.📋 How many items does this list show?
    <ul>
      <li>Mango</li>
      <li>Papaya</li>
      <li>Jamun</li>
      <li>Banana</li>
      <li>Guava</li>
    </ul>
32. 32.📋 What number does the browser show next to “Grapes”?
    <ol>
      <li>Jamun</li>
      <li>Papaya</li>
      <li>Guava</li>
      <li>Banana</li>
      <li>Grapes</li>
    </ol>
33. 33.🔠 Which tag is the least important heading? (a) <h1> (b) <p> (c) <h6> (d) <h3>
34. 34.🖼️ Which picture file does the browser load?
    <img src="bus.jpg" alt="Our school bus" width="350"> (a) tiger.jpg (b) fort.jpg (c) Our school bus (d) bus.jpg
35. 35.🖼️ Which tag puts a picture on a page? (a) <img> (b) <a> (c) <pic> (d) <p>
36. 36.Which of these is a weak password? (a) Kite_Fl1es@Dawn (b) 111111 (c) S0lar!Pen#8 (d) Blue@Tiger_74
37. 37.🌗 Is yellow on white easy or hard to read? (a) easy to read (b) hard to read
38. 38.🔍 Which is the odd one out? (a) reacts to a button click (b) checks a quiz answer (c) adds space around boxes (d) counts down a timer
39. 39.🧭 How many <main> parts should a page have? (a) ten (b) one (c) none (d) three
40. 40.🎯 How many elements on a page should have the same id? (a) 2 (b) 5 (c) 1 (d) any number

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