← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 774 · 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.⚖️ What colour is the text of this element?
    <h1 class="red" id="logo">Hi</h1>
    CSS:
    #logo { color: yellow; }
    .red { color: green; }
    (a) yellow (b) purple (c) green (d) red
  2. 2.⚡ What number does this code print?
    let marks = 5;
    marks = marks + 4;
    marks = marks - 7;
    console.log(marks);
  3. 3.What does justify-content: flex-start do? (a) packs boxes at the end (b) puts boxes in the middle (c) packs boxes at the start (d) equal gaps, none at ends
  4. 4.Which of these goes in the body? (a) <title> (b) <meta charset="utf-8"> (c) <a> (d) <link rel="stylesheet">
  5. 5.♿ Is this heading order correct (no level skipped)?
    <h1> → <h1> → <h2> → <h4>
    (a) No (b) Yes
  6. 6.🔁 What does this code print?
    let score = 8;
    if (score < 23) {
      console.log("You win");
    } else {
      console.log("Play again");
    }
    (a) Play again (b) You win
  7. 7.✍️ In color: blue; which part is the value? (a) ; (b) blue (c) color (d) :
  8. 8.🔁 What does i++ do? (a) takes 1 from i (b) adds 1 to i (c) prints i (d) doubles i
  9. 9.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 16px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 18px;
      }
    }
  10. 10.🎯 Which element does the selector #end style? (a) <h2 class="box"> (b) <h1 id="hero"> (c) <h1 class="end"> (d) <h1 id="end">
  11. 11.🔍 One closing tag is missing. Which one?
    <i>Our school trip</i>
    <small>Good morning!</small>
    <u>Rain today
    (a) </i> (b) </u> (c) </p> (d) </small>
  12. 12.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="tiger.jpg" alt="A tiger asleep" width="400">
    (a) width (b) A red kite (c) tiger.jpg (d) A tiger asleep
  13. 13.Which of these is not safe to do online? (a) use a nickname in games (b) check for https first (c) meet an online stranger (d) keep passwords secret
  14. 14.🛡️ Online: is it safe to use a strong password? (a) safe (b) not safe
  15. 15.🔗 Where does this link open?
    <a href="news.html" target="_blank">School news</a>
    (a) in a new tab (b) in the same tab
  16. 16.🌍 What is the protocol in this URL?
    http://www.example.com/about.html
    (a) /about.html (b) https (c) www.example.com (d) http
  17. 17.🔠 Which tag is the least important heading? (a) <h1> (b) <p> (c) <h3> (d) <h6>
  18. 18.🏷️ Which is the closing tag for <p>? (a) </p> (b) <\p> (c) <p> (d) <p/>
  19. 19.📦 In the box model, which part is the gap to other boxes? (a) content (b) border (c) margin (d) padding
  20. 20.📱 The screen is 1366px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 14px;
      }
    }
  21. 21.Which of these is a strong password? (a) 123456 (b) iloveyou (c) Rain#Drop_42! (d) abcd1234
  22. 22.🌍 What is the path in this URL?
    https://learn.example.com/about.html
    (a) /about.html (b) https (c) learn.example.com (d) /maths/tables.html
  23. 23.True or false: in <img>, width shows if the image fails. (a) True (b) False
  24. 24.🌍 What is the path in this URL?
    http://learn.example.com/maths/tables.html
    (a) http (b) /index.html (c) learn.example.com (d) /maths/tables.html
  25. 25.🔐 Is password a strong or a weak password? (a) weak (b) strong
  26. 26.🧭 Is <div> semantic or not semantic? (a) not semantic (b) semantic
  27. 27.🔢 In a basic web page file, which comes LAST? (a) </html> (b) <!DOCTYPE html> (c) <head> (d) <body>
  28. 28.🖌️ Which CSS property sets the letter colour? (a) font-size (b) color (c) text-align (d) font-weight
  29. 29.🔠 Which tag is used for the main title on a page? (a) <h1> (b) <br> (c) <h6> (d) <p>
  30. 30.Which of these is true of <article>? (a) holds the logo and title (b) holds a news story (c) helps you move around (d) holds extra side notes
  31. 31.💬 Which text will NOT show on the page?
    <p>Our school trip</p>
    <p>I love mangoes.</p>
    <!-- <p>The red kite</p> -->
    (a) I love mangoes. (b) Our school trip (c) The red kite
  32. 32.🔠 How many heading levels does HTML have? (a) 4 (b) 3 (c) 6 (d) 10
  33. 33.♿ A part of the page is under a <h4> heading. Which tag should its sub-heading use? (a) <h5> (b) <h2> (c) <h6> (d) <h1>
  34. 34.📋 What number does the browser show next to “Orange”?
    <ol start="8">
      <li>Litchi</li>
      <li>Jamun</li>
      <li>Banana</li>
      <li>Orange</li>
      <li>Mango</li>
      <li>Papaya</li>
    </ol>
  35. 35.🔢 On a typical page, from top to bottom, which comes FIRST? (a) <nav> (b) <footer> (c) <header> (d) <main>
  36. 36.📊 In a table, which tag is a row? (a) <th> (b) <tr> (c) <td> (d) <tb>
  37. 37.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <nav> (b) <main> (c) <footer>
  38. 38.🔍 Which is the odd one out? (a) has an address bar (b) opens web pages for us (c) is where we type code (d) shows pages from the web
  39. 39.True or false: <article> holds one blog post. (a) True (b) False
  40. 40.🎨 A CSS file usually ends with which extension? (a) .png (b) .html (c) .css (d) .js

Answer key

  1. yellow
  2. 2
  3. packs boxes at the start
  4. <a>
  5. No
  6. You win
  7. blue
  8. adds 1 to i
  9. 18
  10. <h1 id="end">
  11. </u>
  12. A tiger asleep
  13. meet an online stranger
  14. safe
  15. in a new tab
  16. http
  17. <h6>
  18. </p>
  19. margin
  20. 20
  21. Rain#Drop_42!
  22. /about.html
  23. False
  24. /maths/tables.html
  25. weak
  26. not semantic
  27. </html>
  28. color
  29. <h1>
  30. holds a news story
  31. The red kite
  32. 6
  33. <h5>
  34. 11
  35. <header>
  36. <tr>
  37. <nav>
  38. is where we type code
  39. True
  40. .css

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