Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 190 · 40 questions

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.

1. 1.📝 Which input type lets you tick many? (a) submit (b) text (c) checkbox (d) number
2. 2.🛡️ Is it safe to use the same password on every site? (a) Yes (b) No
3. 3.🔢 In a basic web page file, which comes LAST? (a) </head> (b) <head> (c) <html> (d) </html>
4. 4.🎯 Which element does the selector div style? (a) <div class="box"> (b) <h1 id="intro"> (c) <p class="box"> (d) <span>
5. 5.🔠 Which heading shows the BIGGEST text: <h1>, <h3>, <h5> or <h4>? (a) <h5> (b) <h4> (c) <h1> (d) <h3>
6. 6.⚖️ What colour is the text of this element?
   <h2 class="big" id="intro">Hi</h2>
   CSS:
   .big { color: black; }
   #intro { color: white; }
   h2 { color: yellow; } (a) black (b) yellow (c) white (d) purple
7. 7.🔁 What does this code print?
   let marks = 23;
   if (marks >= 34) {
     console.log("Pass");
   } else {
     console.log("Try again");
   } (a) Try again (b) Pass
8. 8.🖌️ Where does the text sit on its line?
   h1 {
     color: orange;
     background-color: red;
     text-align: right;
     font-size: 36px;
   } (a) on the left (b) on the right (c) in the middle
9. 9.♿ Does this help everyone, or make the page harder to use: link text “click here”? (a) helps everyone (b) makes it harder
10. 10.📋 Does this list show bullets or numbers?
    <ul>
      <li>Litchi</li>
      <li>Orange</li>
    </ul> (a) bullets (b) numbers
11. 11.💬 How does an HTML comment end? (a) // (b) */ (c) --> (d) >>
12. 12.⚖️ What colour is the text of this element?
    <h2 class="star" id="logo">Hi</h2>
    CSS:
    h2 { color: yellow; }
    h2 { color: purple; } (a) yellow (b) black (c) purple (d) red
13. 13.🔁 What does i++ do? (a) prints i (b) adds 1 to i (c) doubles i (d) takes 1 from i
14. 14.🧭 Why use <nav> instead of <div> for a menu? (a) it adds pictures (b) it tells its meaning (c) it loads faster (d) it makes text red
15. 15.⚖️ What colour is the text of this element?
    <h1 class="star" id="top">Hi</h1>
    CSS:
    h1 { color: yellow; }
    h1 { color: black; } (a) red (b) black (c) yellow (d) orange
16. 16.💬 How many paragraphs show on the page?
    <!-- <p>Hello, world!</p> -->
    <p>Rain today</p>
    <p>My pets</p>
17. 17.🖼️ Which picture file does the browser load?
    <img src="kite.png" alt="A red kite" width="250"> (a) A red kite (b) cake.jpg (c) kite.png (d) map.png
18. 18.True or false: <a href="a.html">Go</a> goes in script.js. (a) True (b) False
19. 19.True or false: <input type="checkbox"> lets you tick many. (a) False (b) True
20. 20.🔠 Which heading shows the SMALLEST text: <h4>, <h5>, <h3> or <h6>? (a) <h5> (b) <h6> (c) <h3> (d) <h4>
21. 21.🖼️ How many pixels wide is the picture drawn?
    <img src="fort.jpg" alt="An old fort" width="350">
22. 22.📝 Which tag makes a drop-down list? (a) <ul> (b) <select> (c) <ol> (d) <li>
23. 23.📝 What does <br> do? (a) makes a list (b) adds a picture (c) starts a new line (d) makes text bold
24. 24.💬 How many paragraphs show on the page?
    <p>Rain today</p>
    <!-- <p>My best friend</p> -->
    <p>Fun facts</p>
    <!-- <p>Good morning!</p> -->
    <p>I love mangoes.</p>
25. 25.✍️ How many declarations (property: value pairs) are in this rule?
    #top {
      border: 2px solid;
    }
26. 26.📦 In the box model, which part is space inside the border? (a) border (b) padding (c) content (d) margin
27. 27.🔢 To build and share your first web page, which comes first: “test in a browser” or “plan what to show”? (a) test in a browser (b) plan what to show
28. 28.🧭 Which semantic tag holds the logo and title? (a) <nav> (b) <article> (c) <footer> (d) <header>
29. 29.🔗 Which tag makes a clickable link? (a) <a> (b) <p> (c) <img> (d) <link>
30. 30.🔠 Which heading shows the SMALLEST text: <h6>, <h1>, <h5> or <h4>? (a) <h5> (b) <h4> (c) <h6> (d) <h1>
31. 31.Which of these is true of a web browser? (a) is where we type code (b) turns HTML into a page (c) sends pages over the net (d) shows line numbers
32. 32.📦 In the box model, which part is the text or picture? (a) border (b) margin (c) padding (d) content
33. 33.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 220px;
      padding: 10px;
      border: 2px solid black;
      margin: 0px;
    }
34. 34.⚖️ What colour is the text of this element?
    <h1 class="note" id="top">Hi</h1>
    CSS:
    #top { color: blue; }
    #top { color: black; } (a) white (b) blue (c) black (d) green
35. 35.🔍 Which line is missing its closing tag?
    line 1: <h2>Rain today
    line 2: <p>Fun facts</p>
    line 3: <b>Cricket is fun.</b> (a) line 3 (b) line 2 (c) line 1
36. 36.⚖️ What colour is the text of this element?
    <h1 class="big" id="end">Hi</h1>
    CSS:
    .big { color: orange; }
    .big { color: black; } (a) blue (b) black (c) orange (d) white
37. 37.🌍 What is the protocol in this URL?
    http://school.example.in/index.html (a) http (b) /index.html (c) school.example.in (d) https
38. 38.📄 Where does the text of <title> appear? (a) on the browser tab (b) at the bottom (c) nowhere (d) in a big heading
39. 39.⚖️ What colour is the text of this element?
    <h2 class="note" id="top">Hi</h2>
    CSS:
    .note { color: red; }
    .note { color: black; } (a) yellow (b) blue (c) red (d) black
40. 40.📝 At most, how many of these can be chosen at the same time?
    <form>
      <input type="checkbox" name="fruit"> Guava
      <input type="checkbox" name="fruit"> Mango
      <input type="checkbox" name="fruit"> Litchi
      <input type="checkbox" name="fruit"> Banana
      <input type="checkbox" name="fruit"> Papaya
    </form>

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