Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 127 · 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 does this code print? (Look at the quotes!)
   let x = "7";
   let y = 6;
   console.log(x + y); (a) Error (b) 76 (c) 13
2. 2.📦 How much space top to bottom (px) does this box take in all, margin included?
   .box {
     height: 100px;
     padding: 5px;
     border: 1px solid black;
     margin: 5px;
   }
3. 3.🖼️ Which picture file does the browser load?
   <img src="kite.png" alt="A red kite" width="350"> (a) map.png (b) kite.png (c) cake.jpg (d) A red kite
4. 4.💬 Does the browser show comments on the page? (a) Yes (b) No
5. 5.✍️ What value is given to border in this rule?
   h2 {
     border: 2px solid;
     font-style: italic;
     background-color: yellow;
     margin: 10px;
   } (a) 2px solid (b) italic (c) 300px (d) border
6. 6.🛡️ Online: is it safe to use a strong password? (a) not safe (b) safe
7. 7.Which of these has a closing tag? (a) <input> (b) <meta> (c) <b> (d) <br>
8. 8.📋 How many items does this list show?
   <ol>
     <li>Banana</li>
     <li>Grapes</li>
     <li>Jamun</li>
     <li>Orange</li>
     <li>Mango</li>
     <li>Litchi</li>
   </ol>
9. 9.What does font-family do? (a) sets the letter colour (b) colours behind the text (c) centres a heading (d) picks the font style
10. 10.📝 How many <input> tags are in this form?
    <form>
      <input type="text">
      <input type="checkbox">
      <input type="number">
      <input type="password">
      <input type="submit" value="Send">
    </form>
11. 11.💬 How many paragraphs show on the page?
    <p>Rain today</p>
    <p>The red kite</p>
    <p>My best friend</p>
    <p>Cricket is fun.</p>
    <!-- <p>Good morning!</p> -->
12. 12.💬 Why do coders write comments? (a) to make links (b) to leave notes (c) to show pictures (d) to add colour
13. 13.🏷️ Which is the closing tag for <h2>? (a) <h2> (b) <\h2> (c) </h2> (d) <h2/>
14. 14.🔗 Which address opens when you click this link?
    <a href="https://example.com">Contact us</a> (a) Contact us (b) https://example.com (c) art.html (d) maths.html
15. 15.🔁 How many times does this code print “Welcome”?
    for (let i = 0; i < 4; i++) {
      console.log("Welcome");
    }
16. 16.📝 What does <hr> draw? (a) a picture (b) a link (c) a table (d) a line across the page
17. 17.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 470px;
      justify-content: flex-start;
    }
    Inside are 4 boxes, each 100px wide (no margins).
18. 18.🛡️ Online: is it safe to share your password? (a) not safe (b) safe
19. 19.⚡ What number does this code print?
    let a = 53;
    let b = 16;
    console.log(a - b);
20. 20.🔠 Which heading shows the SMALLEST text: <h2>, <h5>, <h1> or <h4>? (a) <h2> (b) <h1> (c) <h5> (d) <h4>
21. 21.🌈 Which colour is rgb(0, 0, 255)? (a) black (b) magenta (c) blue (d) yellow
22. 22.True or false: <a> goes in the body. (a) True (b) False
23. 23.Which of these is safe to do online? (a) share your OTP (b) post your home address (c) ask before downloading (d) type a password on http
24. 24.🔗 What does target="_blank" do to a link? (a) hides the link (b) opens it in a new tab (c) makes it blank (d) makes it bold
25. 25.🔠 Which heading shows the BIGGEST text: <h1>, <h4>, <h6> or <h3>? (a) <h1> (b) <h4> (c) <h3> (d) <h6>
26. 26.⚡ What number does this code print?
    let a = 52;
    let b = 27;
    console.log(a + b);
27. 27.Which of these is an empty tag? (a) <br> (b) <b> (c) <p> (d) <h1>
28. 28.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 16px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 12px;
      }
    }
29. 29.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 270px;
      padding: 15px;
      border: 2px solid black;
      margin: 5px;
    }
30. 30.📋 Does this list show bullets or numbers?
    <ul>
      <li>Mango</li>
      <li>Orange</li>
      <li>Litchi</li>
    </ul> (a) numbers (b) bullets
31. 31.🌈 Which colour of light is strongest in rgb(71, 50, 155)? (a) blue (b) red (c) green
32. 32.True or false: <li> goes inside ul or ol. (a) True (b) False
33. 33.🚀 Which file should this code go in: alert("Hi"); (a) style.css (b) script.js (c) index.html
34. 34.🔗 Which attribute holds the address of a link? (a) alt (b) src (c) id (d) href
35. 35.🖼️ Which attribute of <img> sets how wide it is? (a) height (b) alt (c) width (d) src
36. 36.⚡ What number does this code print?
    let a = 19;
    let b = 23;
    console.log(a + b);
37. 37.📱 The screen is 820px wide. Does the rule inside @media apply?
    p {
      font-size: 24px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 18px;
      }
    } (a) No (b) Yes
38. 38.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 330px;
      justify-content: flex-start;
    }
    Inside are 4 boxes, each 80px wide (no margins).
39. 39.📄 Can HTML on its own make links to pages? (a) No (b) Yes
40. 40.True or false: <tr> makes one table row. (a) True (b) False

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