Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 563 · 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.🖌️ What colour are the letters?
   h2 {
     color: orange;
     font-size: 32px;
     background-color: black;
     text-align: center;
   } (a) orange (b) black (c) red
2. 2.🖼️ Which picture file does the browser load?
   <img src="map.png" alt="Map of India" width="200"> (a) dog.jpg (b) map.png (c) Map of India (d) cake.jpg
3. 3.🔐 Is iloveyou a strong or a weak password? (a) weak (b) strong
4. 4.📝 Which tag gives a form box a name you can click? (a) <h1> (b) <title> (c) <hr> (d) <label>
5. 5.📱 Responsive design means a page ___. (a) is only for laptops (b) never changes (c) has no pictures (d) fits every screen
6. 6.🌈 Which hex code is black? (a) #ffffff (b) #000000 (c) #0000ff (d) #ffff00
7. 7.✍️ How many declarations (property: value pairs) are in this rule?
   #top {
     font-size: 20px;
     color: red;
   }
8. 8.⚡ What number does this code print?
   let a = 13;
   let b = 18;
   console.log(a + b);
9. 9.💪 How wide (px) is each gap between two boxes?
   .row {
     display: flex;
     width: 170px;
     justify-content: space-between;
   }
   Inside are 2 boxes, each 60px wide (no margins).
10. 10.True or false: <input> is an empty tag. (a) False (b) True
11. 11.🔗 Where does this link open?
    <a href="contact.html" target="_blank">Take the quiz</a> (a) in the same tab (b) in a new tab
12. 12.⚖️ What colour is the text of this element?
    <p class="note" id="logo">Hi</p>
    CSS:
    .note { color: white; }
    p { color: green; } (a) purple (b) green (c) white (d) red
13. 13.📊 How many cells are in each row?
    <table>
      <tr><td>Mango</td><td>Guava</td><td>Mango</td><td>Guava</td></tr>
      <tr><td>Papaya</td><td>Papaya</td><td>Papaya</td><td>Banana</td></tr>
    </table>
14. 14.True or false: HTML on its own cannot keep a high score. (a) False (b) True
15. 15.🔗 Where does this link open?
    <a href="about.html">Contact us</a> (a) in a new tab (b) in the same tab
16. 16.💪 Which justify-content value equal gaps, none at ends? (a) center (b) space-between (c) flex-start (d) flex-end
17. 17.🔠 Which heading shows the SMALLEST text: <h1>, <h2>, <h3> or <h6>? (a) <h2> (b) <h3> (c) <h1> (d) <h6>
18. 18.♿ Does this help everyone, or make the page harder to use: images with no alt? (a) helps everyone (b) makes it harder
19. 19.🔢 When you open a web page, which comes first: “the browser asks it” or “the browser shows it”? (a) the browser shows it (b) the browser asks it
20. 20.📊 In a table, which tag is a row? (a) <tr> (b) <th> (c) <tb> (d) <td>
21. 21.🔠 How many headings are in this code?
    <h1>Good morning!</h1>
    <h3>Our school trip</h3>
    <h4>I love mangoes.</h4>
    <p>Our school trip</p>
    <h3>Good morning!</h3>
22. 22.True or false: body is an element selector. (a) False (b) True
23. 23.📝 Does <li> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
24. 24.🖌️ What colour is behind the letters?
    li {
      text-align: left;
      font-size: 36px;
      background-color: purple;
      color: blue;
    } (a) red (b) blue (c) purple
25. 25.📱 The screen is 700px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 16px;
      }
    }
26. 26.🔍 One closing tag is missing. Which one?
    <h2>My pets</h2>
    <h1>I love mangoes.
    <p>The red kite</p> (a) </h3> (b) </h2> (c) </p> (d) </h1>
27. 27.🔗 Which words do you click on?
    <a href="about.html">Maths fun</a> (a) Art corner (b) Maths fun (c) href (d) about.html
28. 28.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Art Gallery</title>
    </head>
    <body>
      <h1>Welcome!</h1>
      <p>Thanks for visiting.</p>
    </body>
    </html> (a) Thanks for visiting. (b) index.html (c) Welcome! (d) Art Gallery
29. 29.🔢 To build and share your first web page, which comes first: “plan what to show” or “test in a browser”? (a) test in a browser (b) plan what to show
30. 30.Which of these is safe to do online? (a) click prize links (b) download from pop-ups (c) check for https first (d) share your OTP
31. 31.📋 Which list shows the steps of a recipe best? (a) <hr> (b) <br> (c) <ol> (d) <ul>
32. 32.True or false: <header> holds the main content. (a) True (b) False
33. 33.True or false: HTML on its own can keep a high score. (a) False (b) True
34. 34.🔐 Is riya2014 a strong or a weak password? (a) weak (b) strong
35. 35.📝 What does <p> make? (a) a picture (b) a table (c) a link (d) a paragraph
36. 36.🎯 Which element does the selector .note style? (a) <p id="note"> (b) <h1 class="red"> (c) <p class="note"> (d) <p class="big">
37. 37.🌍 What do we call the computer that stores a website? (a) a printer (b) a server (c) a keyboard (d) a mouse
38. 38.🔢 In a basic web page file, which comes first: “<!DOCTYPE html>” or “<body>”? (a) <body> (b) <!DOCTYPE html>
39. 39.🏷️ Is </body> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
40. 40.📝 How many paragraphs does this code make?
    <p>Our school trip</p>
    <p>Our school trip</p>
    <p>Rain today</p>
    <h2>My best friend</h2>

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