← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 360 · 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 of these is a closing tag? (a) <title> (b) <li> (c) </p> (d) <body>
  2. 2.📊 How many cells are in each row?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Banana</td><td>Orange</td><td>Jamun</td><td>Orange</td></tr>
      <tr><td>Guava</td><td>Guava</td><td>Litchi</td><td>Orange</td></tr>
    </table>
  3. 3.📱 What does a media query check? (a) the battery level (b) the screen width (c) the page title (d) the time of day
  4. 4.📋 What number does the browser show next to “Grapes”?
    <ol>
      <li>Jamun</li>
      <li>Papaya</li>
      <li>Litchi</li>
      <li>Guava</li>
      <li>Grapes</li>
    </ol>
  5. 5.🔗 Which tag makes a clickable link? (a) <img> (b) <link> (c) <a> (d) <p>
  6. 6.📝 Which input type is for an email address? (a) checkbox (b) radio (c) number (d) email
  7. 7.🎯 Which CSS selector matches this element?
    <div class="red" id="intro">Hello</div>     (a) .box (b) span (c) #intro (d) #red
  8. 8.⚖️ What colour is the text of this element?
    <p class="big" id="intro">Hi</p>
    CSS:
    #intro { color: orange; }
    #intro { color: white; }     (a) orange (b) white (c) blue (d) black
  9. 9.🔍 Which is the odd one out? (a) answers page requests (b) saves our .html files (c) sends pages over the net (d) stores a website’s files
  10. 10.🌗 Is black on white easy or hard to read? (a) hard to read (b) easy to read
  11. 11.📝 Does <li> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
  12. 12.✍️ In color: blue; which part is the value? (a) blue (b) color (c) ; (d) :
  13. 13.🔗 Where does this link open?
    <a href="quiz.html">Maths fun</a>     (a) in a new tab (b) in the same tab
  14. 14.🌈 How many pairs of hex digits are in a colour like #ff8800? (a) 6 (b) 2 (c) 3 (d) 4
  15. 15.✍️ What is the selector in this CSS rule?
    h2 {
      padding: 8px;
      width: 300px;
    }     (a) h2 (b) 300px (c) h1 (d) padding
  16. 16.🔠 Which heading shows the BIGGEST text: <h1>, <h3>, <h5> or <h4>? (a) <h1> (b) <h4> (c) <h5> (d) <h3>
  17. 17.🔁 What does this code print?
    let score = 16;
    if (score > 22) {
      console.log("You win");
    } else {
      console.log("Play again");
    }     (a) Play again (b) You win
  18. 18.True or false: the border is space inside the border. (a) True (b) False
  19. 19.🔁 What is the LAST number this code prints?
    for (let i = 0; i < 7; i = i + 4) {
      console.log(i);
    }
  20. 20.📄 Can HTML on its own make a form? (a) No (b) Yes
  21. 21.💬 Why do coders write comments? (a) to make links (b) to show pictures (c) to add colour (d) to leave notes
  22. 22.True or false: the content is the gap to other boxes. (a) True (b) False
  23. 23.🔁 What does this code print?
    let age = 9;
    if (age >= 25) {
      console.log("teen");
    } else {
      console.log("child");
    }     (a) child (b) teen
  24. 24.✍️ CSS declarations go inside which brackets? (a) ( ) (b) [ ] (c) < > (d) { }
  25. 25.Which of these is true of <article>? (a) holds the menu of links (b) holds one blog post (c) is the page’s key part (d) holds the logo and title
  26. 26.⚡ Which JavaScript word runs code when true? (a) console.log() (b) if (c) alert() (d) for
  27. 27.🔢 In a basic web page file, which comes first: “<body>” or “<html>”? (a) <html> (b) <body>
  28. 28.🔗 Where does this link open?
    <a href="maths.html">Contact us</a>     (a) in the same tab (b) in a new tab
  29. 29.🏷️ Is <title> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
  30. 30.🔠 How many <h1> headings should a page usually have? (a) 3 (b) 6 (c) 1 (d) 10
  31. 31.🔁 When does the else part run? (a) when if is true (b) always (c) never (d) when if is false
  32. 32.📝 At most, how many of these can be chosen at the same time?
    <form>
      <input type="radio" name="fruit"> Papaya
      <input type="radio" name="fruit"> Banana
      <input type="radio" name="fruit"> Litchi
      <input type="radio" name="fruit"> Mango
      <input type="radio" name="fruit"> Guava
    </form>
  33. 33.💬 How many paragraphs show on the page?
    <!-- <p>The red kite</p> -->
    <p>I love mangoes.</p>
    <p>My best friend</p>
  34. 34.📱 The screen is 320px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 16px;
    }
    @media (min-width: 1024px) {
      p {
        font-size: 20px;
      }
    }
  35. 35.🔁 What does i++ do? (a) prints i (b) takes 1 from i (c) adds 1 to i (d) doubles i
  36. 36.True or false: <style> goes in the head. (a) False (b) True
  37. 37.🔡 Are HTML tag names usually written in small letters? (a) Yes (b) No
  38. 38.Which of these is a strong password? (a) password (b) 123456 (c) Blue@Tiger_74 (d) iloveyou
  39. 39.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 160px;
      padding: 30px;
      border: 2px solid black;
      margin: 15px;
    }
  40. 40.📋 Which list suits a shopping list in any order? (a) <hr> (b) <ol> (c) <br> (d) <ul>

Answer key

  1. </p>
  2. 4
  3. the screen width
  4. 5
  5. <a>
  6. email
  7. #intro
  8. white
  9. saves our .html files
  10. easy to read
  11. has a closing tag
  12. blue
  13. in the same tab
  14. 3
  15. h2
  16. <h1>
  17. Play again
  18. False
  19. 4
  20. Yes
  21. to leave notes
  22. False
  23. child
  24. { }
  25. holds one blog post
  26. if
  27. <html>
  28. in the same tab
  29. an opening tag
  30. 1
  31. when if is false
  32. 1
  33. 2
  34. 16
  35. adds 1 to i
  36. True
  37. Yes
  38. Blue@Tiger_74
  39. 254
  40. <ul>

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