Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 120 · 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 kind of selector is p? (a) an id selector (b) an element selector (c) a class selector
2. 2.🔗 Which address opens when you click this link?
   <a href="news.html">Maths fun</a> (a) quiz.html (b) games.html (c) Maths fun (d) news.html
3. 3.♿ What does good colour contrast mean? (a) only red text (b) text stands out clearly (c) no colours at all (d) many bright colours
4. 4.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 12px;
   }
   @media (max-width: 480px) {
     p {
       font-size: 6px;
     }
   }
5. 5.⚖️ What colour is the text of this element?
   <h1 class="big" id="end">Hi</h1>
   CSS:
   .big { color: black; }
   #end { color: blue; }
   h1 { color: green; } (a) white (b) black (c) green (d) blue
6. 6.🖌️ What colour is behind the letters?
   h2 {
     background-color: red;
     color: orange;
     text-align: left;
     font-size: 24px;
   } (a) red (b) yellow (c) orange
7. 7.🔁 What does this code print?
   let score = 46;
   if (score >= 26) {
     console.log("You win");
   } else {
     console.log("Play again");
   } (a) Play again (b) You win
8. 8.🏷️ Which is the closing tag for <h3>? (a) <h3/> (b) <\h3> (c) <h3> (d) </h3>
9. 9.📄 Can HTML on its own count button clicks? (a) No (b) Yes
10. 10.⚡ What number does this code print?
    let marks = 13;
    marks = marks + 9;
    marks = marks - 12;
    console.log(marks);
11. 11.📋 How many items does this list show?
    <ol>
      <li>Banana</li>
      <li>Jamun</li>
    </ol>
12. 12.🔢 When you open a web page, which comes first: “DNS finds the server” or “you type the URL”? (a) DNS finds the server (b) you type the URL
13. 13.Which of these has a closing tag? (a) <br> (b) <hr> (c) <ul> (d) <img>
14. 14.💬 Can anyone read your comments by viewing the page source? (a) Yes (b) No
15. 15.🖼️ Which attribute of <img> is read by screen readers? (a) alt (b) width (c) src (d) height
16. 16.🔐 Is abcd1234 a strong or a weak password? (a) weak (b) strong
17. 17.True or false: the browser sends the page back. (a) True (b) False
18. 18.✍️ In color: blue; which part is the value? (a) blue (b) : (c) color (d) ;
19. 19.📋 How many items does this list show?
    <ol>
      <li>Litchi</li>
      <li>Jamun</li>
    </ol>
20. 20.📋 Which tag goes around each item of a list? (a) <li> (b) <ul> (c) <ol> (d) <p>
21. 21.⚖️ What colour is the text of this element?
    <h2 class="big" id="main">Hi</h2>
    CSS:
    #main { color: orange; }
    #main { color: yellow; } (a) orange (b) yellow (c) red (d) blue
22. 22.🖼️ Why do we add alt text to an image? (a) to describe the image (b) to load it faster (c) to make it bigger (d) to colour it
23. 23.🔗 Which attribute holds the address of a link? (a) src (b) href (c) id (d) alt
24. 24.True or false: to use a nickname in games is not safe. (a) False (b) True
25. 25.🖼️ Which attribute of <img> tells which image to load? (a) alt (b) height (c) width (d) src
26. 26.🔁 How many times does this code print “Welcome”?
    for (let i = 0; i <= 8; i++) {
      console.log("Welcome");
    }
27. 27.🔐 Is password a strong or a weak password? (a) strong (b) weak
28. 28.📱 The screen is 1366px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 14px;
      }
    }
29. 29.⚡ What number does this code print?
    let coins = 7;
    coins = coins + 2;
    coins = coins - 9;
    console.log(coins);
30. 30.🔐 Is Mango#Kite29! a strong or a weak password? (a) weak (b) strong
31. 31.📊 Where do <td> cells go? (a) inside a <li> (b) inside a <tr> (c) inside the <head> (d) inside a <p>
32. 32.What does font-family do? (a) picks the font style (b) makes the text bold (c) colours behind the text (d) centres a heading
33. 33.True or false: “skipping heading levels” helps everyone use the page. (a) False (b) True
34. 34.🛡️ Should you share your password with your best friend? (a) Yes (b) No
35. 35.What does color do? (a) sets the letter colour (b) picks the font style (c) centres a heading (d) colours behind the text
36. 36.📝 How many paragraphs does this code make?
    <p>My pets</p>
    <p>Hello, world!</p>
    <p>The red kite</p>
    <p>My pets</p>
    <p>The red kite</p>
37. 37.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 100px;
      justify-content: center;
    }
    Inside are 2 boxes, each 40px wide (no margins).
38. 38.♿ Does this help everyone, or make the page harder to use: use headings in order? (a) makes it harder (b) helps everyone
39. 39.True or false: <h1> goes in the head. (a) False (b) True
40. 40.🌗 Is white on black easy or hard to read? (a) hard to read (b) easy to read

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