← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 151 · 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.📱 The screen is 320px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 6px;
      }
    }
    (a) No (b) Yes
  2. 2.🔁 Which word runs code only when something is true? (a) log (b) let (c) if (d) for
  3. 3.🔢 In a basic web page file, which comes first: “</head>” or “<body>”? (a) <body> (b) </head>
  4. 4.⚡ What does this code show?
    let name = "Riya";
    alert("Hi, " + name + "!");
    (a) Riya (b) Hi, name! (c) Hi, Riya! (d) name
  5. 5.🔢 To build and share your first web page, what comes right after “write the HTML”? (a) add CSS styles (b) plan what to show (c) publish it online (d) test in a browser
  6. 6.🔠 Which heading shows the BIGGEST text: <h6>, <h4>, <h1> or <h3>? (a) <h4> (b) <h3> (c) <h1> (d) <h6>
  7. 7.🔗 Which address opens when you click this link?
    <a href="art.html">About us</a>
    (a) About us (b) art.html (c) news.html (d) quiz.html
  8. 8.🧭 Is <div> semantic or not semantic? (a) not semantic (b) semantic
  9. 9.🔠 Which heading shows the SMALLEST text: <h3>, <h4>, <h6> or <h5>? (a) <h5> (b) <h3> (c) <h6> (d) <h4>
  10. 10.🎯 Can many elements share the same class? (a) No (b) Yes
  11. 11.Which of these goes in the body? (a) <h1> (b) <style> (c) <title> (d) <link rel="stylesheet">
  12. 12.Which of these does JavaScript do? (a) gives the page structure (b) reacts to a button click (c) adds space around boxes (d) puts a picture on a page
  13. 13.🔢 In a basic web page file, which comes first: “<head>” or “<body>”? (a) <body> (b) <head>
  14. 14.⚡ What does this code show?
    let name = "Kabir";
    console.log("Hello, " + name + "!");
    (a) name (b) Kabir (c) Hello, Kabir! (d) Hello, name!
  15. 15.⚡ Which JavaScript word shows a pop-up box? (a) for (b) console.log() (c) alert() (d) let
  16. 16.🔗 Which address opens when you click this link?
    <a href="maths.html">Play games</a>
    (a) art.html (b) news.html (c) Play games (d) maths.html
  17. 17.🧭 Is <header> semantic or not semantic? (a) semantic (b) not semantic
  18. 18.📱 What does a media query check? (a) the page title (b) the screen width (c) the time of day (d) the battery level
  19. 19.🌈 What is the biggest number one colour can have in rgb()? (a) 100 (b) 1000 (c) 99 (d) 255
  20. 20.🖌️ Where does the text sit on its line?
    h1 {
      background-color: red;
      font-size: 12px;
      text-align: left;
      color: black;
    }
    (a) on the right (b) in the middle (c) on the left
  21. 21.True or false: HTML on its own cannot add pictures to a page. (a) True (b) False
  22. 22.🔠 How many headings are in this code?
    <h1>Hello, world!</h1>
    <h3>My pets</h3>
    <p>Hello, world!</p>
    <p>Hello, world!</p>
  23. 23.True or false: the browser shows the page to you. (a) False (b) True
  24. 24.🔠 Which heading shows the BIGGEST text: <h3>, <h5>, <h6> or <h1>? (a) <h5> (b) <h6> (c) <h3> (d) <h1>
  25. 25.💬 Which text will NOT show on the page?
    <!-- <p>I love mangoes.</p> -->
    <p>Rain today</p>
    <p>Fun facts</p>
    <p>My best friend</p>
    (a) I love mangoes. (b) Fun facts (c) My best friend (d) Rain today
  26. 26.🧭 Which semantic tag holds the menu of links? (a) <main> (b) <article> (c) <nav> (d) <footer>
  27. 27.True or false: <li> is an empty tag. (a) False (b) True
  28. 28.⚡ What number does this code print?
    let a = 12;
    let b = 10;
    console.log(a * b);
  29. 29.🌈 Which colour is rgb(0, 255, 0)? (a) blue (b) bright green (c) white (d) red
  30. 30.True or false: CSS changes the text size. (a) False (b) True
  31. 31.⚡ Which JavaScript word makes a new variable? (a) for (b) let (c) console.log() (d) alert()
  32. 32.⚡ What does this code print? (Look at the quotes!)
    let x = "9";
    let y = 3;
    console.log(x + y);
    (a) 93 (b) Error (c) 12
  33. 33.📝 Which input type lets you tick many? (a) submit (b) date (c) checkbox (d) text
  34. 34.🔁 How many times does this code print “Hi”?
    for (let i = 1; i < 9; i++) {
      console.log("Hi");
    }
  35. 35.🏷️ Is </h1> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
  36. 36.📊 Which tag makes one table row? (a) <caption> (b) <tr> (c) <table> (d) <td>
  37. 37.🚀 Which file should this code go in: alert(score); (a) script.js (b) style.css (c) index.html
  38. 38.📝 On how many lines does the browser show this paragraph?
    <p>Roses are red<br>Stars shine<br>Birds sing<br>Sky is blue</p>
  39. 39.🌈 Which colour of light is strongest in rgb(202, 49, 106)? (a) green (b) red (c) blue
  40. 40.📝 Which input type picks a day? (a) email (b) password (c) text (d) date

Answer key

  1. Yes
  2. if
  3. </head>
  4. Hi, Riya!
  5. add CSS styles
  6. <h1>
  7. art.html
  8. not semantic
  9. <h6>
  10. Yes
  11. <h1>
  12. reacts to a button click
  13. <head>
  14. Hello, Kabir!
  15. alert()
  16. maths.html
  17. semantic
  18. the screen width
  19. 255
  20. on the left
  21. False
  22. 2
  23. True
  24. <h1>
  25. I love mangoes.
  26. <nav>
  27. False
  28. 120
  29. bright green
  30. True
  31. let
  32. 93
  33. checkbox
  34. 8
  35. a closing tag
  36. <tr>
  37. script.js
  38. 4
  39. red
  40. date

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