← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 605 · 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 820px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 16px;
    }
    @media (min-width: 768px) {
      p {
        font-size: 20px;
      }
    }
  2. 2.True or false: <header> holds a news story. (a) True (b) False
  3. 3.🌐 Which one stores a website’s files? (a) a code editor (b) a web server (c) a web browser
  4. 4.✍️ Which sign goes between a property and its value? (a) - (b) : (c) ; (d) =
  5. 5.🎯 Which CSS selector matches this element?
    <h2 class="box" id="top">Hello</h2>
    (a) #box (b) #intro (c) .star (d) h2
  6. 6.🌍 What do we call the computer that stores a website? (a) a mouse (b) a server (c) a keyboard (d) a printer
  7. 7.🔢 In a basic web page file, which comes first: “</head>” or “<body>”? (a) <body> (b) </head>
  8. 8.🔗 Which attribute holds the address of a link? (a) src (b) id (c) alt (d) href
  9. 9.🌍 Which one stores the site’s files? (a) the URL (b) the browser (c) the server (d) HTTPS
  10. 10.🔠 Which heading shows the SMALLEST text: <h1>, <h3>, <h2> or <h6>? (a) <h1> (b) <h6> (c) <h3> (d) <h2>
  11. 11.📊 How many rows does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th></tr>
      <tr><td>Guava</td><td>Guava</td></tr>
      <tr><td>Litchi</td><td>Guava</td></tr>
    </table>
  12. 12.🌈 Which colour of light is strongest in rgb(125, 196, 107)? (a) red (b) green (c) blue
  13. 13.🌐 Which one has an address bar? (a) a web server (b) a web browser (c) a code editor
  14. 14.✍️ In color: blue; which part is the property? (a) blue (b) : (c) ; (d) color
  15. 15.🖌️ What colour are the letters?
    h2 {
      font-size: 32px;
      text-align: center;
      color: blue;
      background-color: yellow;
    }
    (a) purple (b) blue (c) yellow
  16. 16.💪 Which justify-content value puts boxes in the middle? (a) space-between (b) flex-end (c) flex-start (d) center
  17. 17.Which of these is true of a web server? (a) shows pages from the web (b) saves our .html files (c) has an address bar (d) hosts websites online
  18. 18.🖼️ How many pixels wide is the picture drawn?
    <img src="map.png" alt="Map of India" width="300">
  19. 19.True or false: to use a nickname in games is not safe. (a) False (b) True
  20. 20.📱 max-width: 600px applies when the screen is ___. (a) 600px or narrower (b) exactly 1000px (c) 600px or wider (d) turned off
  21. 21.📄 What does the browser tab show for this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Art Gallery</title>
    </head>
    <body>
      <h1>Planets</h1>
      <p>I like to read.</p>
    </body>
    </html>
    (a) index.html (b) I like to read. (c) Art Gallery (d) Planets
  22. 22.Which of these is true of a web server? (a) colours code to help us (b) turns HTML into a page (c) shows line numbers (d) sends pages over the net
  23. 23.📝 Which input type is for an email address? (a) radio (b) email (c) checkbox (d) date
  24. 24.🎯 What kind of selector is #end? (a) a class selector (b) an element selector (c) an id selector
  25. 25.🔁 Which word runs code only when something is true? (a) log (b) for (c) if (d) let
  26. 26.🔁 How many times does this code print “Welcome”?
    for (let i = 0; i < 3; i++) {
      console.log("Welcome");
    }
  27. 27.True or false: <input type="radio"> hides what you type. (a) True (b) False
  28. 28.🌗 Is pink on red easy or hard to read? (a) hard to read (b) easy to read
  29. 29.🌗 Is blue on purple easy or hard to read? (a) easy to read (b) hard to read
  30. 30.🔗 What does target="_blank" do to a link? (a) makes it blank (b) makes it bold (c) opens it in a new tab (d) hides the link
  31. 31.📄 Which part holds everything you see on the page? (a) the body (b) the doctype (c) the head (d) the title
  32. 32.🔠 Are headings shown in bold by default? (a) Yes (b) No
  33. 33.🖌️ Where does the text sit on its line?
    h2 {
      font-size: 32px;
      background-color: blue;
      color: white;
      text-align: right;
    }
    (a) on the left (b) in the middle (c) on the right
  34. 34.What is <input type="number"> for? (a) lets you pick only one (b) takes only numbers (c) hides what you type (d) lets you tick many
  35. 35.True or false: in <img>, height names the picture file. (a) True (b) False
  36. 36.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <footer> (b) <nav> (c) <main>
  37. 37.Which of these is safe to do online? (a) type a password on http (b) post your home address (c) share your password (d) use a strong password
  38. 38.⚡ What number does this code print?
    let a = 6;
    let b = 3;
    console.log(a * b);
  39. 39.🖼️ Which attribute of <img> is read by screen readers? (a) width (b) height (c) alt (d) src
  40. 40.🔁 How many times does this code print “Welcome”?
    for (let i = 3; i < 11; i++) {
      console.log("Welcome");
    }

Answer key

  1. 20
  2. False
  3. a web server
  4. :
  5. h2
  6. a server
  7. </head>
  8. href
  9. the server
  10. <h6>
  11. 3
  12. green
  13. a web browser
  14. color
  15. blue
  16. center
  17. hosts websites online
  18. 300
  19. False
  20. 600px or narrower
  21. Art Gallery
  22. sends pages over the net
  23. email
  24. an id selector
  25. if
  26. 3
  27. False
  28. hard to read
  29. hard to read
  30. opens it in a new tab
  31. the body
  32. Yes
  33. on the right
  34. takes only numbers
  35. False
  36. <nav>
  37. use a strong password
  38. 18
  39. alt
  40. 8

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