← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 408 · 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.🔠 Which heading shows the BIGGEST text: <h4>, <h5>, <h6> or <h2>? (a) <h6> (b) <h2> (c) <h4> (d) <h5>
  2. 2.⚡ Which word makes a new variable? (a) give (b) let (c) put (d) make
  3. 3.🚀 Where in index.html does the link to style.css go? (a) after </html> (b) in the footer (c) inside a <p> (d) in the head
  4. 4.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="map.png" alt="Map of India" width="350">
    (a) Birthday cake (b) map.png (c) width (d) Map of India
  5. 5.🔗 Which attribute holds the address of a link? (a) src (b) alt (c) id (d) href
  6. 6.🔁 Which word runs code only when something is true? (a) let (b) for (c) log (d) if
  7. 7.⚡ What does this code print? (Look at the quotes!)
    let x = "6";
    let y = 3;
    console.log(x + y);
    (a) 9 (b) Error (c) 63
  8. 8.📋 Which tag goes around each item of a list? (a) <p> (b) <ol> (c) <li> (d) <ul>
  9. 9.🔢 When you open a web page, what comes right after “the browser asks it”? (a) the server sends files (b) DNS finds the server (c) you type the URL (d) the browser shows it
  10. 10.📋 How many items does this list show?
    <ul>
      <li>Litchi</li>
      <li>Banana</li>
      <li>Orange</li>
    </ul>
  11. 11.True or false: <a> goes in the head. (a) True (b) False
  12. 12.📄 Where does <meta charset="utf-8"> go: in the head or in the body? (a) in the body (b) in the head
  13. 13.📊 In a table, which tag is a row? (a) <th> (b) <tb> (c) <td> (d) <tr>
  14. 14.📝 What does <br> do? (a) starts a new line (b) adds a picture (c) makes text bold (d) makes a list
  15. 15.🎯 What kind of selector is .card? (a) an id selector (b) an element selector (c) a class selector
  16. 16.🔢 To build and share your first web page, which comes first: “plan what to show” or “publish it online”? (a) plan what to show (b) publish it online
  17. 17.🔍 One closing tag is missing. Which one?
    <p>Fun facts</p>
    <strong>Cricket is fun.</strong>
    <h2>My pets
    (a) </p> (b) </h2> (c) </u> (d) </strong>
  18. 18.🎯 What kind of selector is #main? (a) an id selector (b) a class selector (c) an element selector
  19. 19.💪 Which flexbox property spaces boxes along a row? (a) flex-direction (b) align-items (c) justify-content (d) display: flex
  20. 20.🔠 Which heading shows the BIGGEST text: <h3>, <h4>, <h6> or <h2>? (a) <h4> (b) <h6> (c) <h3> (d) <h2>
  21. 21.🛡️ Online: is it safe to keep passwords secret? (a) not safe (b) safe
  22. 22.🔗 Where does this link open?
    <a href="art.html" target="_blank">Play games</a>
    (a) in a new tab (b) in the same tab
  23. 23.🌍 Which one stores the site’s files? (a) the URL (b) the server (c) the browser (d) HTTPS
  24. 24.True or false: <table> holds the whole table. (a) True (b) False
  25. 25.📝 How many paragraphs does this code make?
    <p>My pets</p>
    <h2>Our school trip</h2>
    <h2>Fun facts</h2>
  26. 26.📄 Where does the text of <title> appear? (a) in a big heading (b) nowhere (c) on the browser tab (d) at the bottom
  27. 27.🖌️ How big is the text, in px?
    li {
      background-color: black;
      text-align: left;
      color: red;
      font-size: 16px;
    }
  28. 28.⚖️ Two rules with the same selector set a colour. Which one wins? (a) the shorter one (b) the first one (c) neither (d) the later one
  29. 29.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th></tr>
      <tr><td>Grapes</td><td>Litchi</td></tr>
    </table>
  30. 30.🔁 How many numbers does this code print?
    for (let i = 0; i < 5; i = i + 3) {
      console.log(i);
    }
  31. 31.🌈 What is the biggest number one colour can have in rgb()? (a) 99 (b) 1000 (c) 100 (d) 255
  32. 32.🔐 Is riya2014 a strong or a weak password? (a) strong (b) weak
  33. 33.⚖️ Which selector is the weakest? (a) an id selector (b) an element selector (c) a class selector
  34. 34.🔗 What does target="_blank" do to a link? (a) makes it blank (b) hides the link (c) opens it in a new tab (d) makes it bold
  35. 35.🏷️ Every HTML tag starts with which sign? (a) { (b) < (c) ( (d) [
  36. 36.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="fort.jpg" alt="An old fort" width="250">
    (a) width (b) An old fort (c) fort.jpg (d) A tiger asleep
  37. 37.💬 How many paragraphs show on the page?
    <p>Hello, world!</p>
    <p>I love mangoes.</p>
    <p>Our school trip</p>
    <!-- <p>Good morning!</p> -->
    <p>Fun facts</p>
  38. 38.🔢 To build and share your first web page, what comes right after “plan what to show”? (a) publish it online (b) write the HTML (c) test in a browser (d) add CSS styles
  39. 39.⚖️ What colour is the text of this element?
    <p class="box" id="hero">Hi</p>
    CSS:
    .box { color: red; }
    .box { color: yellow; }
    (a) blue (b) red (c) white (d) yellow
  40. 40.True or false: <p>Hello!</p> goes in style.css. (a) True (b) False

Answer key

  1. <h2>
  2. let
  3. in the head
  4. Map of India
  5. href
  6. if
  7. 63
  8. <li>
  9. the server sends files
  10. 3
  11. False
  12. in the head
  13. <tr>
  14. starts a new line
  15. a class selector
  16. plan what to show
  17. </h2>
  18. an id selector
  19. justify-content
  20. <h2>
  21. safe
  22. in a new tab
  23. the server
  24. True
  25. 1
  26. on the browser tab
  27. 16
  28. the later one
  29. 2
  30. 2
  31. 255
  32. weak
  33. an element selector
  34. opens it in a new tab
  35. <
  36. An old fort
  37. 4
  38. write the HTML
  39. yellow
  40. False

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