Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 755 · 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 of these is true of <footer>? (a) holds the logo and title (b) holds copyright notes (c) holds the main content (d) is the page’s key part
2. 2.⚡ Which tag holds JavaScript in a page? (a) <script> (b) <code> (c) <js> (d) <style>
3. 3.True or false: the browser sends the page back. (a) False (b) True
4. 4.True or false: <table> goes in the body. (a) True (b) False
5. 5.🎨 One CSS file can style how many pages? (a) only one word (b) only one image (c) no pages (d) many pages
6. 6.🔒 Is the connection to this address scrambled (encrypted)?
   http://www.example.com/art/gallery.html (a) No (b) Yes
7. 7.📦 In the box model, which part is space inside the border? (a) margin (b) padding (c) content (d) border
8. 8.📱 The screen is 1100px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 24px;
   }
   @media (max-width: 480px) {
     p {
       font-size: 18px;
     }
   }
9. 9.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="dog.jpg" alt="A happy dog" width="100"> (a) width (b) dog.jpg (c) A happy dog (d) The full moon
10. 10.True or false: <img src="cat.png"> goes in index.html. (a) True (b) False
11. 11.True or false: “add alt text to images” helps everyone use the page. (a) True (b) False
12. 12.🌗 Is dark grey on white easy or hard to read? (a) easy to read (b) hard to read
13. 13.📱 The screen is 820px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 8px;
      }
    } (a) Yes (b) No
14. 14.♿ Does this help everyone, or make the page harder to use: tiny grey text? (a) makes it harder (b) helps everyone
15. 15.🖼️ Which attribute of <img> sets how tall it is? (a) alt (b) width (c) src (d) height
16. 16.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th></tr>
      <tr><td>Jamun</td><td>Orange</td></tr>
      <tr><td>Orange</td><td>Jamun</td></tr>
      <tr><td>Guava</td><td>Papaya</td></tr>
    </table>
17. 17.True or false: <ul> goes in the head. (a) True (b) False
18. 18.📊 Which tag makes one table row? (a) <tr> (b) <th> (c) <td> (d) <table>
19. 19.📝 Does <h1> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
20. 20.True or false: <h1> has a closing tag. (a) True (b) False
21. 21.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 60px;
      padding: 15px;
      border: 4px solid black;
      margin: 10px;
    }
22. 22.Which of these goes in the body? (a) <link rel="stylesheet"> (b) <a> (c) <style> (d) <title>
23. 23.🔡 Are HTML tag names usually written in small letters? (a) No (b) Yes
24. 24.📱 The screen is 1100px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 14px;
      }
    }
25. 25.Which of these does JavaScript do? (a) makes headings and lists (b) changes the text size (c) rounds box corners (d) changes the page live
26. 26.⚡ Which word makes a new variable? (a) let (b) make (c) put (d) give
27. 27.What does justify-content: flex-start do? (a) packs boxes at the end (b) packs boxes at the start (c) puts boxes in the middle (d) equal gaps, none at ends
28. 28.🛡️ Should you share your password with your best friend? (a) Yes (b) No
29. 29.🎨 A CSS file usually ends with which extension? (a) .png (b) .js (c) .html (d) .css
30. 30.💬 How many paragraphs show on the page?
    <p>Good morning!</p>
    <p>Fun facts</p>
    <!-- <p>I love mangoes.</p> -->
31. 31.⚡ Which JavaScript word shows a pop-up box? (a) let (b) for (c) alert() (d) console.log()
32. 32.True or false: a code editor opens web pages for us. (a) True (b) False
33. 33.⚖️ What colour is the text of this element?
    <p class="note" id="top">Hi</p>
    CSS:
    .note { color: orange; }
    .note { color: yellow; } (a) white (b) black (c) orange (d) yellow
34. 34.🖼️ Which picture file does the browser load?
    <img src="tiger.jpg" alt="A tiger asleep" width="150"> (a) map.png (b) kite.png (c) A tiger asleep (d) tiger.jpg
35. 35.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 3; i++) {
      total = total + i;
    }
    console.log(total);
36. 36.🖼️ Which tag puts a picture on a page? (a) <img> (b) <pic> (c) <p> (d) <a>
37. 37.🔠 How many headings are in this code?
    <h1>My pets</h1>
    <p>Good morning!</p>
    <h3>My best friend</h3>
    <h3>I love mangoes.</h3>
    <h2>My best friend</h2>
38. 38.🧭 Is <aside> semantic or not semantic? (a) not semantic (b) semantic
39. 39.📊 Where do <td> cells go? (a) inside a <p> (b) inside the <head> (c) inside a <tr> (d) inside a <li>
40. 40.🛡️ Online: is it safe to share your OTP? (a) not safe (b) safe

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