Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 757 · 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.True or false: “add alt text to images” helps everyone use the page. (a) True (b) False
2. 2.Which of these is true of <header>? (a) holds one blog post (b) helps you move around (c) holds the main content (d) sits at the very top
3. 3.⚡ What number does this code print?
   let a = 41;
   let b = 7;
   console.log(a - b);
4. 4.⚡ What number does this code print?
   let a = 17;
   let b = 35;
   console.log(a + b);
5. 5.🖌️ What colour is behind the letters?
   li {
     text-align: center;
     background-color: orange;
     color: red;
     font-size: 24px;
   } (a) blue (b) orange (c) red
6. 6.✍️ How many declarations (property: value pairs) are in this rule?
   .box {
     font-weight: bold;
   }
7. 7.🧭 How many <main> parts should a page have? (a) one (b) ten (c) three (d) none
8. 8.🔁 What does this code print?
   let score = 30;
   if (score >= 45) {
     console.log("You win");
   } else {
     console.log("Play again");
   } (a) Play again (b) You win
9. 9.True or false: in <img>, alt is read by screen readers. (a) False (b) True
10. 10.🔠 Which heading shows the SMALLEST text: <h1>, <h2>, <h5> or <h6>? (a) <h2> (b) <h1> (c) <h6> (d) <h5>
11. 11.🎯 Which element does the selector #intro style? (a) <h2 class="intro"> (b) <h2 id="main"> (c) <h2 id="intro"> (d) <li class="box">
12. 12.🛡️ Before typing a password on a site, check the address starts with ___. (a) http (b) www (c) https (d) ftp
13. 13.✍️ What is the selector in this CSS rule?
    p {
      font-size: 20px;
      font-weight: bold;
      width: 300px;
      border: 2px solid;
    } (a) p (b) font-size (c) bold (d) .note
14. 14.📱 The screen is 820px wide. Does the rule inside @media apply?
    p {
      font-size: 24px;
    }
    @media (max-width: 600px) {
      p {
        font-size: 22px;
      }
    } (a) No (b) Yes
15. 15.🖼️ How many pixels wide is the picture drawn?
    <img src="cake.jpg" alt="Birthday cake" width="200">
16. 16.🧭 Why use <nav> instead of <div> for a menu? (a) it loads faster (b) it adds pictures (c) it tells its meaning (d) it makes text red
17. 17.🌈 Hex digits go 0 to 9, then A to which letter? (a) F (b) Z (c) J (d) G
18. 18.📊 Which tag makes a heading cell? (a) <td> (b) <th> (c) <tr> (d) <table>
19. 19.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 60px;
      padding: 5px;
      border: 5px solid black;
      margin: 0px;
    }
20. 20.✍️ How does a CSS comment start? (a) // (b) <!-- (c) # (d) /*
21. 21.🔍 Which line is missing its closing tag?
    line 1: <u>Our school trip</u>
    line 2: <b>Cricket is fun.
    line 3: <strong>I love mangoes.</strong> (a) line 3 (b) line 1 (c) line 2
22. 22.🖌️ Which CSS property picks the font style? (a) font-weight (b) text-align (c) font-family (d) background-color
23. 23.Which of these is not safe to do online? (a) meet an online stranger (b) ask before downloading (c) log out on shared PCs (d) keep passwords secret
24. 24.🌍 Which one is the page’s address? (a) the URL (b) HTTPS (c) the server (d) the browser
25. 25.🔗 What does target="_blank" do to a link? (a) makes it bold (b) hides the link (c) makes it blank (d) opens it in a new tab
26. 26.⚡ What number does this code print?
    let a = 46;
    let b = 33;
    console.log(a + b);
27. 27.✍️ How many declarations (property: value pairs) are in this rule?
    li {
      padding: 8px;
      font-size: 20px;
    }
28. 28.✍️ What value is given to font-weight in this rule?
    .box {
      font-weight: bold;
      font-style: italic;
      color: red;
    } (a) font-weight (b) 300px (c) 2px solid (d) bold
29. 29.🎯 Which CSS selector matches this element?
    <p class="big" id="hero">Hello</p> (a) #top (b) .hero (c) p (d) h1
30. 30.✍️ What value is given to padding in this rule?
    body {
      font-weight: bold;
      width: 300px;
      padding: 8px;
    } (a) bold (b) 2px solid (c) 8px (d) padding
31. 31.📋 Which list tag is one item of a list? (a) <ul> (b) <ol> (c) <li>
32. 32.🛡️ Online: is it safe to share your password? (a) safe (b) not safe
33. 33.🖼️ Which picture file does the browser load?
    <img src="map.png" alt="Map of India" width="250"> (a) Map of India (b) cake.jpg (c) map.png (d) dog.jpg
34. 34.📝 On how many lines does the browser show this paragraph?
    <p>Sky is blue<br>Stars shine</p>
35. 35.🚀 Which file should this code go in: <h1>My Site</h1> (a) script.js (b) style.css (c) index.html
36. 36.📝 How many paragraphs does this code make?
    <p>Hello, world!</p>
    <p>Fun facts</p>
    <p>I love mangoes.</p>
    <h2>I love mangoes.</h2>
    <h2>My pets</h2>
    <p>Fun facts</p>
37. 37.💬 Which text will NOT show on the page?
    <p>Our school trip</p>
    <p>I love mangoes.</p>
    <!-- <p>Fun facts</p> --> (a) Our school trip (b) I love mangoes. (c) Fun facts
38. 38.📋 What number does the browser show next to “Grapes”?
    <ol>
      <li>Jamun</li>
      <li>Grapes</li>
      <li>Orange</li>
      <li>Mango</li>
    </ol>
39. 39.🔤 In “HTML”, what does the M stand for? (a) Modern (b) Machine (c) Mouse (d) Markup
40. 40.💬 How many paragraphs show on the page?
    <!-- <p>Hello, world!</p> -->
    <p>My pets</p>
    <!-- <p>My best friend</p> -->

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