← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 596 · 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.⚖️ What colour is the text of this element?
    <p class="red" id="top">Hi</p>
    CSS:
    #top { color: white; }
    p { color: green; }     (a) white (b) green (c) red (d) yellow
  2. 2.True or false: HTTPS asks for a web page. (a) False (b) True
  3. 3.🔠 Which heading shows the SMALLEST text: <h4>, <h5>, <h2> or <h3>? (a) <h4> (b) <h3> (c) <h5> (d) <h2>
  4. 4.📝 Which input type takes only numbers? (a) password (b) email (c) submit (d) number
  5. 5.⚖️ Which selector is the weakest? (a) an id selector (b) a class selector (c) an element selector
  6. 6.⚡ Which tag holds JavaScript in a page? (a) <js> (b) <style> (c) <script> (d) <code>
  7. 7.🏷️ Which is the closing tag for <h2>? (a) <\h2> (b) <h2> (c) <h2/> (d) </h2>
  8. 8.🏷️ Is </b> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
  9. 9.True or false: a code editor turns HTML into a page. (a) False (b) True
  10. 10.Which of these does HTML do? (a) lays out the page (b) adds space around boxes (c) gives the page structure (d) sets colours and fonts
  11. 11.✍️ Which sign ends each CSS declaration? (a) , (b) . (c) : (d) ;
  12. 12.🔠 Which heading shows the BIGGEST text: <h4>, <h5>, <h1> or <h6>? (a) <h6> (b) <h4> (c) <h1> (d) <h5>
  13. 13.📋 Which list shows the steps of a recipe best? (a) <ol> (b) <ul> (c) <hr> (d) <br>
  14. 14.🌈 Which hex code is cyan? (a) #000000 (b) #ff0000 (c) #00ffff (d) #00ff00
  15. 15.What is <input type="submit"> for? (a) picks a day (b) sends the form (c) lets you tick many (d) lets you pick only one
  16. 16.📝 How many paragraphs does this code make?
    <p>Good morning!</p>
    <h2>My best friend</h2>
    <h2>My pets</h2>
  17. 17.💬 How many paragraphs show on the page?
    <!-- <p>My pets</p> -->
    <p>Hello, world!</p>
    <p>Cricket is fun.</p>
    <p>The red kite</p>
  18. 18.True or false: a web server answers page requests. (a) False (b) True
  19. 19.🔁 What does this code print?
    let temp = 49;
    if (temp >= 43) {
      console.log("Hot");
    } else {
      console.log("Cool");
    }     (a) Cool (b) Hot
  20. 20.📋 Which list suits a shopping list in any order? (a) <br> (b) <ol> (c) <hr> (d) <ul>
  21. 21.🎨 A CSS file usually ends with which extension? (a) .js (b) .css (c) .png (d) .html
  22. 22.🖼️ Which picture file does the browser load?
    <img src="map.png" alt="Map of India" width="50">     (a) cake.jpg (b) map.png (c) Map of India (d) dog.jpg
  23. 23.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 240px;
      justify-content: center;
    }
    Inside are 2 boxes, each 50px wide (no margins).
  24. 24.✍️ What is the selector in this CSS rule?
    .box {
      font-size: 20px;
      border: 2px solid;
      margin: 10px;
      text-align: center;
    }     (a) .box (b) 2px solid (c) h2 (d) font-size
  25. 25.🔁 How many numbers does this code print?
    for (let i = 0; i < 11; i = i + 4) {
      console.log(i);
    }
  26. 26.🧩 Which language makes a form box? (a) HTML (b) JavaScript (c) CSS
  27. 27.💬 How many paragraphs show on the page?
    <p>Rain today</p>
    <p>My best friend</p>
    <!-- <p>Hello, world!</p> -->
    <p>Fun facts</p>
  28. 28.📝 At most, how many of these can be chosen at the same time?
    <form>
      <input type="radio" name="fruit"> Litchi
      <input type="radio" name="fruit"> Papaya
      <input type="radio" name="fruit"> Mango
      <input type="radio" name="fruit"> Guava
    </form>
  29. 29.True or false: a code editor shows line numbers. (a) False (b) True
  30. 30.🔍 One closing tag is missing. Which one?
    <em>Fun facts</em>
    <u>Good morning!
    <h2>My best friend</h2>     (a) </em> (b) </h2> (c) </u> (d) </i>
  31. 31.🔠 Which heading shows the BIGGEST text: <h1>, <h4>, <h6> or <h3>? (a) <h4> (b) <h3> (c) <h1> (d) <h6>
  32. 32.🧭 Which semantic tag sits at the very top? (a) <article> (b) <header> (c) <aside> (d) <main>
  33. 33.True or false: in <img>, alt names the picture file. (a) False (b) True
  34. 34.🔢 In a basic web page file, which comes FIRST? (a) <!DOCTYPE html> (b) <head> (c) </body> (d) </html>
  35. 35.💬 How many paragraphs show on the page?
    <!-- <p>Fun facts</p> -->
    <p>Cricket is fun.</p>
    <p>Our school trip</p>
    <p>I love mangoes.</p>
  36. 36.🔗 Where does this link open?
    <a href="art.html" target="_blank">Maths fun</a>     (a) in the same tab (b) in a new tab
  37. 37.Which colour pair is hard to read? (a) white on dark blue (b) dark grey on white (c) pink on red (d) yellow on black
  38. 38.🌍 What is the path in this URL?
    https://school.example.in/art/gallery.html     (a) school.example.in (b) https (c) /news/today.html (d) /art/gallery.html
  39. 39.🖌️ How big is the text, in px?
    h2 {
      background-color: purple;
      text-align: left;
      color: orange;
      font-size: 12px;
    }
  40. 40.True or false: to type a password on http is safe. (a) True (b) False

Answer key

  1. white
  2. False
  3. <h5>
  4. number
  5. an element selector
  6. <script>
  7. </h2>
  8. a closing tag
  9. False
  10. gives the page structure
  11. ;
  12. <h1>
  13. <ol>
  14. #00ffff
  15. sends the form
  16. 1
  17. 3
  18. True
  19. Hot
  20. <ul>
  21. .css
  22. map.png
  23. 70
  24. .box
  25. 3
  26. HTML
  27. 3
  28. 1
  29. True
  30. </u>
  31. <h1>
  32. <header>
  33. False
  34. <!DOCTYPE html>
  35. 3
  36. in a new tab
  37. pink on red
  38. /art/gallery.html
  39. 12
  40. False

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