← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 852 · 40 questions
TalentJR

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.

NameDateTime takenScore ___ / 40
  1. 1.🏷️ Is <b> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
  2. 2.Which of these is a weak password? (a) Kite_Fl1es@Dawn (b) riya2014 (c) Rain#Drop_42! (d) Blue@Tiger_74
  3. 3.🔠 Which heading shows the BIGGEST text: <h2>, <h4>, <h1> or <h6>? (a) <h2> (b) <h1> (c) <h6> (d) <h4>
  4. 4.🛡️ Is it safe to use the same password on every site? (a) Yes (b) No
  5. 5.💬 How many paragraphs show on the page?
    <!-- <p>Our school trip</p> -->
    <p>My best friend</p>
    <!-- <p>My pets</p> -->
    <!-- <p>The red kite</p> -->
  6. 6.🛡️ Online: is it safe to type a password on http? (a) not safe (b) safe
  7. 7.🧭 Which semantic tag holds a side box of tips? (a) <aside> (b) <header> (c) <main> (d) <footer>
  8. 8.True or false: <p>Hello!</p> goes in script.js. (a) True (b) False
  9. 9.🛡️ Online: is it safe to think before you post? (a) safe (b) not safe
  10. 10.💬 How many paragraphs show on the page?
    <p>Rain today</p>
    <!-- <p>My pets</p> -->
    <p>Hello, world!</p>
    <p>The red kite</p>
    <!-- <p>My best friend</p> -->
  11. 11.True or false: <nav> holds the menu of links. (a) False (b) True
  12. 12.⚖️ What colour is the text of this element?
    <p class="box" id="logo">Hi</p>
    CSS:
    p { color: orange; }
    p { color: blue; }     (a) white (b) blue (c) red (d) orange
  13. 13.True or false: <header> sits at the very top. (a) True (b) False
  14. 14.🌈 Which colour of light is strongest in rgb(2, 134, 210)? (a) red (b) green (c) blue
  15. 15.🖼️ Which attribute of <img> sets how tall it is? (a) src (b) height (c) alt (d) width
  16. 16.🌗 Is yellow on white easy or hard to read? (a) hard to read (b) easy to read
  17. 17.🔍 Which is the odd one out? (a) shows pages from the web (b) opens web pages for us (c) is where we type code (d) turns HTML into a page
  18. 18.🔁 Which loop repeats code a set number of times? (a) else (b) let (c) for (d) if
  19. 19.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 10px;
      }
    }
  20. 20.🔗 Which address opens when you click this link?
    <a href="about.html">About us</a>     (a) https://example.com (b) about.html (c) contact.html (d) About us
  21. 21.🧭 Is <span> semantic or not semantic? (a) not semantic (b) semantic
  22. 22.🌈 In #006400 the green part is the hex number 64. What is it as a normal number?
  23. 23.⚖️ What colour is the text of this element?
    <h1 class="menu" id="top">Hi</h1>
    CSS:
    #top { color: purple; }
    #top { color: red; }     (a) red (b) purple (c) green (d) white
  24. 24.🚀 Which file should this code go in: <ul><li>Art</li></ul> (a) script.js (b) style.css (c) index.html
  25. 25.True or false: <main> holds the main content. (a) False (b) True
  26. 26.Which of these is true of <footer>? (a) holds one blog post (b) sits at the bottom (c) is the page’s key part (d) holds the logo and title
  27. 27.📱 The screen is 700px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 22px;
      }
    }     (a) No (b) Yes
  28. 28.📊 How many cells are in each row?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Jamun</td><td>Orange</td><td>Orange</td></tr>
      <tr><td>Orange</td><td>Litchi</td><td>Mango</td></tr>
    </table>
  29. 29.⚡ What number does this code print?
    let a = 10;
    let b = 10;
    console.log(a * b);
  30. 30.🌐 Which one colours code to help us? (a) a code editor (b) a web server (c) a web browser
  31. 31.💬 Which text will NOT show on the page?
    <p>Hello, world!</p>
    <p>My best friend</p>
    <p>Fun facts</p>
    <!-- <p>Our school trip</p> -->     (a) Hello, world! (b) My best friend (c) Fun facts (d) Our school trip
  32. 32.🛡️ Before typing a password on a site, check the address starts with ___. (a) https (b) www (c) http (d) ftp
  33. 33.🌈 Which hex code is white? (a) #0000ff (b) #ff00ff (c) #ffffff (d) #ffff00
  34. 34.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 370px;
      justify-content: space-between;
    }
    Inside are 4 boxes, each 40px wide (no margins).
  35. 35.Which of these is true of <header>? (a) holds a side box of tips (b) sits at the very top (c) holds one blog post (d) holds the menu of links
  36. 36.True or false: a web browser has an address bar. (a) True (b) False
  37. 37.🔠 Which heading shows the BIGGEST text: <h4>, <h5>, <h3> or <h2>? (a) <h4> (b) <h5> (c) <h3> (d) <h2>
  38. 38.📋 What number does the browser show next to “Guava”?
    <ol>
      <li>Orange</li>
      <li>Banana</li>
      <li>Guava</li>
    </ol>
  39. 39.🖌️ Which CSS property makes letters bigger? (a) font-weight (b) font-family (c) font-size (d) color
  40. 40.📝 On how many lines does the browser show this paragraph?
    <p>Birds sing<br>Stars shine<br>Roses are red<br>Sky is blue<br>Rivers flow</p>

Answer key

  1. an opening tag
  2. riya2014
  3. <h1>
  4. No
  5. 1
  6. not safe
  7. <aside>
  8. False
  9. safe
  10. 3
  11. True
  12. blue
  13. True
  14. blue
  15. height
  16. hard to read
  17. is where we type code
  18. for
  19. 10
  20. about.html
  21. not semantic
  22. 100
  23. red
  24. index.html
  25. True
  26. sits at the bottom
  27. Yes
  28. 3
  29. 100
  30. a code editor
  31. Our school trip
  32. https
  33. #ffffff
  34. 70
  35. sits at the very top
  36. True
  37. <h2>
  38. 3
  39. font-size
  40. 5

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