Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 371 · 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.True or false: <p> has a closing tag. (a) True (b) False
2. 2.⚖️ Two rules with the same selector set a colour. Which one wins? (a) the later one (b) the shorter one (c) neither (d) the first one
3. 3.🔠 How many headings are in this code?
   <h1>The red kite</h1>
   <h4>Our school trip</h4>
   <p>Hello, world!</p>
   <p>My best friend</p>
   <p>I love mangoes.</p>
4. 4.✍️ How many declarations (property: value pairs) are in this rule?
   p {
     background-color: yellow;
     font-style: italic;
     border: 2px solid;
     margin: 10px;
   }
5. 5.📝 Which input type hides what you type? (a) checkbox (b) password (c) date (d) number
6. 6.True or false: HTML on its own can make a form. (a) False (b) True
7. 7.📄 Where does the text of <title> appear? (a) in a big heading (b) on the browser tab (c) at the bottom (d) nowhere
8. 8.🔍 Which line is missing its closing tag?
   line 1: <em>My pets</em>
   line 2: <h1>Fun facts</h1>
   line 3: <p>Hello, world! (a) line 3 (b) line 2 (c) line 1
9. 9.🎨 What does CSS stand for? (a) Computer Style Sheets (b) Colourful Site Styles (c) Creative Sheet System (d) Cascading Style Sheets
10. 10.♿ Does this help everyone, or make the page harder to use: link text “click here”? (a) helps everyone (b) makes it harder
11. 11.💬 How many paragraphs show on the page?
    <p>I love mangoes.</p>
    <p>Fun facts</p>
    <!-- <p>Good morning!</p> -->
12. 12.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 110px;
      justify-content: flex-start;
    }
    Inside are 2 boxes, each 40px wide (no margins).
13. 13.📊 How many cells are in each row?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Jamun</td><td>Grapes</td><td>Guava</td></tr>
      <tr><td>Papaya</td><td>Orange</td><td>Banana</td></tr>
      <tr><td>Banana</td><td>Litchi</td><td>Banana</td></tr>
    </table>
14. 14.What does justify-content: space-between do? (a) packs boxes at the end (b) packs boxes at the start (c) puts boxes in the middle (d) equal gaps, none at ends
15. 15.🔗 Where does this link open?
    <a href="news.html">School news</a> (a) in the same tab (b) in a new tab
16. 16.📝 How many paragraphs does this code make?
    <p>Hello, world!</p>
    <h2>I love mangoes.</h2>
    <p>Fun facts</p>
    <p>Good morning!</p>
17. 17.🖼️ Which attribute of <img> sets how wide it is? (a) alt (b) width (c) height (d) src
18. 18.🔢 To build and share your first web page, which comes FIRST? (a) publish it online (b) test in a browser (c) plan what to show (d) write the HTML
19. 19.📱 The screen is 700px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 10px;
      }
    } (a) No (b) Yes
20. 20.🔢 In a basic web page file, which comes FIRST? (a) <body> (b) <head> (c) </html> (d) <!DOCTYPE html>
21. 21.📊 Are <th> cells shown bold and centred by default? (a) No (b) Yes
22. 22.⚖️ Which selector is the weakest? (a) an element selector (b) a class selector (c) an id selector
23. 23.📄 Where does <title> go: in the head or in the body? (a) in the head (b) in the body
24. 24.🔁 Which word runs code only when something is true? (a) if (b) let (c) for (d) log
25. 25.⚡ Which JavaScript word repeats code? (a) if (b) let (c) for (d) alert()
26. 26.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 6; i++) {
      total = total + i;
    }
    console.log(total);
27. 27.🖼️ Which attribute of <img> describes the picture? (a) width (b) alt (c) src (d) height
28. 28.📝 Which input type lets you tick many? (a) email (b) submit (c) radio (d) checkbox
29. 29.🔠 Which heading shows the BIGGEST text: <h1>, <h2>, <h5> or <h4>? (a) <h2> (b) <h1> (c) <h5> (d) <h4>
30. 30.True or false: #end is an id selector. (a) True (b) False
31. 31.Which of these is a strong password? (a) iloveyou (b) S0lar!Pen#8 (c) abcd1234 (d) 123456
32. 32.🚀 Which file is best for code that reacts to clicks? (a) style.css (b) script.js (c) index.html (d) notes.txt
33. 33.Which of these does HTML do? (a) rounds box corners (b) shows a pop-up message (c) checks a quiz answer (d) makes a link
34. 34.🔠 Which heading shows the BIGGEST text: <h3>, <h2>, <h1> or <h4>? (a) <h3> (b) <h2> (c) <h4> (d) <h1>
35. 35.📄 Where does <p> go: in the head or in the body? (a) in the body (b) in the head
36. 36.True or false: <footer> holds one blog post. (a) False (b) True
37. 37.Which of these is the border? (a) the gap to other boxes (b) the line round the box (c) space inside the border (d) the gap round content
38. 38.🌈 Which hex code is yellow? (a) #ffff00 (b) #000000 (c) #00ff00 (d) #ffffff
39. 39.📊 Which tag gives the table a title? (a) <td> (b) <table> (c) <caption> (d) <tr>
40. 40.📋 Does this list show bullets or numbers?
    <ul>
      <li>Grapes</li>
      <li>Litchi</li>
      <li>Papaya</li>
    </ul> (a) bullets (b) numbers

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