Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 597 · 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 tag makes one data cell? (a) <th> (b) <td> (c) <table> (d) <caption>
2. 2.True or false: JavaScript checks a quiz answer. (a) False (b) True
3. 3.📋 Does this list show bullets or numbers?
   <ol>
     <li>Mango</li>
     <li>Orange</li>
   </ol> (a) bullets (b) numbers
4. 4.💬 How many paragraphs show on the page?
   <p>Hello, world!</p>
   <!-- <p>Fun facts</p> -->
   <!-- <p>Cricket is fun.</p> -->
5. 5.True or false: <p>Hello!</p> goes in style.css. (a) True (b) False
6. 6.📊 How many rows does this table have?
   <table>
     <tr><td>Mango</td><td>Banana</td><td>Orange</td><td>Guava</td></tr>
     <tr><td>Mango</td><td>Litchi</td><td>Banana</td><td>Mango</td></tr>
   </table>
7. 7.What does justify-content: flex-end do? (a) packs boxes at the start (b) equal gaps, none at ends (c) packs boxes at the end (d) puts boxes in the middle
8. 8.⚖️ Two rules with the same selector set a colour. Which one wins? (a) neither (b) the shorter one (c) the first one (d) the later one
9. 9.🎯 Which CSS selector matches this element?
   <div class="note" id="main">Hello</div> (a) #logo (b) #note (c) .main (d) .note
10. 10.📱 The screen is 1366px wide. Does the rule inside @media apply?
    p {
      font-size: 20px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 14px;
      }
    } (a) No (b) Yes
11. 11.🔢 When you open a web page, which comes first: “DNS finds the server” or “the server sends files”? (a) the server sends files (b) DNS finds the server
12. 12.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 460px;
      justify-content: flex-start;
    }
    Inside are 4 boxes, each 100px wide (no margins).
13. 13.True or false: h1 { font-size: 32px; } goes in style.css. (a) True (b) False
14. 14.🏷️ Is </p> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
15. 15.🔁 What does i++ do? (a) doubles i (b) takes 1 from i (c) prints i (d) adds 1 to i
16. 16.💪 Which justify-content value packs boxes at the end? (a) flex-start (b) flex-end (c) space-between (d) center
17. 17.True or false: to think before you post is safe. (a) True (b) False
18. 18.Which colour pair is hard to read? (a) pink on red (b) dark grey on white (c) white on dark blue (d) white on black
19. 19.🌍 What is the path in this URL?
    http://school.example.in/news/today.html (a) /games/chess.html (b) school.example.in (c) http (d) /news/today.html
20. 20.🔠 Which heading shows the SMALLEST text: <h2>, <h4>, <h1> or <h6>? (a) <h2> (b) <h6> (c) <h4> (d) <h1>
21. 21.📝 Does <img> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
22. 22.Which of these is a weak password? (a) Mango#Kite29! (b) riya2014 (c) Chai$Cup_19x (d) S0lar!Pen#8
23. 23.🖌️ What colour is behind the letters?
    h2 {
      background-color: blue;
      font-size: 40px;
      text-align: center;
      color: red;
    } (a) white (b) red (c) blue
24. 24.♿ A part of the page is under a <h5> heading. Which tag should its sub-heading use? (a) <h6> (b) <h2> (c) <h5> (d) <h3>
25. 25.🎯 Which element does the selector div style? (a) <span> (b) <p class="note"> (c) <div class="note"> (d) <h1 id="top">
26. 26.✍️ What is the selector in this CSS rule?
    li {
      font-style: italic;
      width: 300px;
    } (a) li (b) font-style (c) body (d) 300px
27. 27.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 130px;
      justify-content: space-between;
    }
    Inside are 2 boxes, each 50px wide (no margins).
28. 28.Which of these is the border? (a) the gap to other boxes (b) the line round the box (c) the gap round content (d) space outside the border
29. 29.⚖️ Which selector is the weakest? (a) an element selector (b) an id selector (c) a class selector
30. 30.💬 Which text will NOT show on the page?
    <p>My pets</p>
    <p>Good morning!</p>
    <p>Hello, world!</p>
    <!-- <p>Our school trip</p> --> (a) Good morning! (b) Hello, world! (c) Our school trip (d) My pets
31. 31.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 200px;
      justify-content: center;
    }
    Inside are 2 boxes, each 80px wide (no margins).
32. 32.🖌️ Which CSS property centres a heading? (a) background-color (b) color (c) text-align (d) font-family
33. 33.🖼️ How many pixels wide is the picture drawn?
    <img src="moon.png" alt="The full moon" width="250">
34. 34.Which colour pair is hard to read? (a) black on white (b) yellow on black (c) white on black (d) blue on purple
35. 35.🔠 How many headings are in this code?
    <h1>My pets</h1>
    <p>The red kite</p>
    <p>Fun facts</p>
    <p>My pets</p>
    <h3>Good morning!</h3>
36. 36.💬 How many paragraphs show on the page?
    <!-- <p>I love mangoes.</p> -->
    <p>Good morning!</p>
    <p>Cricket is fun.</p>
37. 37.💪 Which flexbox property spaces boxes along a row? (a) flex-direction (b) align-items (c) display: flex (d) justify-content
38. 38.📄 Where does <ul> go: in the head or in the body? (a) in the head (b) in the body
39. 39.💬 How does an HTML comment start? (a) <!-- (b) /* (c) # (d) //
40. 40.True or false: <h1> goes in the head. (a) False (b) True

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