← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 429 · 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 tag is the least important heading? (a) <h3> (b) <h1> (c) <h6> (d) <p>
  2. 2.📋 How many items does this list show?
    <ul>
      <li>Jamun</li>
      <li>Guava</li>
      <li>Papaya</li>
      <li>Banana</li>
      <li>Orange</li>
    </ul>
  3. 3.⚡ Where does console.log() show its output? (a) on the title bar (b) in the address bar (c) in the console (d) on the printer
  4. 4.🔗 Which words do you click on?
    <a href="maths.html">About us</a>     (a) Contact us (b) href (c) About us (d) maths.html
  5. 5.💪 Which flexbox property picks row or column? (a) flex-direction (b) align-items (c) justify-content (d) gap
  6. 6.📄 Where does <style> go: in the head or in the body? (a) in the body (b) in the head
  7. 7.🔗 Where does this link open?
    <a href="games.html" target="_blank">Maths fun</a>     (a) in a new tab (b) in the same tab
  8. 8.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (min-width: 1024px) {
      p {
        font-size: 22px;
      }
    }
  9. 9.✍️ Which sign ends each CSS declaration? (a) ; (b) . (c) , (d) :
  10. 10.⚖️ What colour is the text of this element?
    <h2 class="big" id="end">Hi</h2>
    CSS:
    #end { color: green; }
    h2 { color: purple; }     (a) green (b) yellow (c) red (d) purple
  11. 11.🛡️ Is it safe to use the same password on every site? (a) No (b) Yes
  12. 12.🔠 Which heading shows the BIGGEST text: <h6>, <h2>, <h4> or <h3>? (a) <h6> (b) <h3> (c) <h2> (d) <h4>
  13. 13.Which of these is safe to do online? (a) type a password on http (b) ask before downloading (c) share your OTP (d) put secrets in comments
  14. 14.📋 Does this list show bullets or numbers?
    <ol>
      <li>Jamun</li>
      <li>Orange</li>
    </ol>     (a) bullets (b) numbers
  15. 15.📋 Which list tag lists things in any order? (a) <ol> (b) <li> (c) <ul>
  16. 16.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 3; i++) {
      total = total + i;
    }
    console.log(total);
  17. 17.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 24px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 26px;
      }
    }
  18. 18.Which of these has a closing tag? (a) <br> (b) <input> (c) <li> (d) <img>
  19. 19.🔠 How many headings are in this code?
    <h1>My best friend</h1>
    <p>Cricket is fun.</p>
    <p>My pets</p>
  20. 20.📄 What is the first line of an HTML5 page? (a) <head> (b) <!DOCTYPE html> (c) <html> (d) <body>
  21. 21.🔗 Which words do you click on?
    <a href="games.html">School news</a>     (a) games.html (b) href (c) Take the quiz (d) School news
  22. 22.📝 Which tag holds a whole form? (a) <ol> (b) <form> (c) <input> (d) <table>
  23. 23.🧭 Is <article> semantic or not semantic? (a) not semantic (b) semantic
  24. 24.📋 Which list suits a shopping list in any order? (a) <br> (b) <hr> (c) <ol> (d) <ul>
  25. 25.🛡️ A pop-up says you won a prize and asks for your password. What do you do? (a) type the password (b) share it with friends (c) close it, tell an adult (d) click it twice
  26. 26.🔢 In a basic web page file, which comes LAST? (a) <html> (b) </html> (c) <head> (d) </head>
  27. 27.🔁 How many times does this code print “Welcome”?
    for (let i = 3; i < 6; i++) {
      console.log("Welcome");
    }
  28. 28.📝 Which tag makes a big box for many lines of text? (a) <textarea> (b) <br> (c) <p> (d) <input>
  29. 29.💬 How does an HTML comment end? (a) >> (b) --> (c) */ (d) //
  30. 30.🔗 Which tag makes a clickable link? (a) <img> (b) <a> (c) <link> (d) <p>
  31. 31.⚖️ What colour is the text of this element?
    <p class="note" id="logo">Hi</p>
    CSS:
    #logo { color: white; }
    #logo { color: orange; }     (a) white (b) blue (c) orange (d) purple
  32. 32.True or false: <input type="number"> takes only numbers. (a) False (b) True
  33. 33.📊 Where do <td> cells go? (a) inside a <li> (b) inside a <tr> (c) inside a <p> (d) inside the <head>
  34. 34.📱 What does a media query check? (a) the page title (b) the time of day (c) the screen width (d) the battery level
  35. 35.📝 Does <h1> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
  36. 36.True or false: padding is the line round the box. (a) True (b) False
  37. 37.🎯 What kind of selector is #end? (a) a class selector (b) an element selector (c) an id selector
  38. 38.⚡ What does JavaScript add to a web page? (a) only colours (b) the page title (c) the domain name (d) actions and changes
  39. 39.🧭 Which semantic tag helps you move around? (a) <nav> (b) <main> (c) <article> (d) <header>
  40. 40.True or false: in <img>, alt is read by screen readers. (a) True (b) False

Answer key

  1. <h6>
  2. 5
  3. in the console
  4. About us
  5. flex-direction
  6. in the head
  7. in a new tab
  8. 20
  9. ;
  10. green
  11. No
  12. <h2>
  13. ask before downloading
  14. numbers
  15. <ul>
  16. 6
  17. 24
  18. <li>
  19. 1
  20. <!DOCTYPE html>
  21. School news
  22. <form>
  23. semantic
  24. <ul>
  25. close it, tell an adult
  26. </html>
  27. 3
  28. <textarea>
  29. -->
  30. <a>
  31. orange
  32. True
  33. inside a <tr>
  34. the screen width
  35. has a closing tag
  36. False
  37. an id selector
  38. actions and changes
  39. <nav>
  40. True

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