Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 50 · 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.🛡️ Online: is it safe to check for https first? (a) safe (b) not safe
2. 2.📄 What does the browser tab show for this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>Class 7 Blog</title>
   </head>
   <body>
     <h1>Planets</h1>
     <p>I like to read.</p>
   </body>
   </html> (a) I like to read. (b) index.html (c) Planets (d) Class 7 Blog
3. 3.🔢 When you open a web page, what comes right after “the browser asks it”? (a) the server sends files (b) the browser shows it (c) you type the URL (d) DNS finds the server
4. 4.True or false: “link text “click here”” makes the page harder to use. (a) False (b) True
5. 5.✍️ How many declarations (property: value pairs) are in this rule?
   h2 {
     text-align: center;
     color: red;
   }
6. 6.🌈 Which colour is rgb(0, 0, 255)? (a) blue (b) black (c) red (d) bright green
7. 7.📋 Does this list show bullets or numbers?
   <ol>
     <li>Litchi</li>
     <li>Orange</li>
   </ol> (a) bullets (b) numbers
8. 8.⚖️ What colour is the text of this element?
   <h2 class="big" id="logo">Hi</h2>
   CSS:
   .big { color: red; }
   .big { color: black; } (a) red (b) green (c) black (d) white
9. 9.🖼️ How many pixels wide is the picture drawn?
   <img src="dog.jpg" alt="A happy dog" width="250">
10. 10.📱 The screen is 320px wide. Does the rule inside @media apply?
    p {
      font-size: 20px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 18px;
      }
    } (a) No (b) Yes
11. 11.⚖️ What colour is the text of this element?
    <h2 class="red" id="intro">Hi</h2>
    CSS:
    #intro { color: orange; }
    #intro { color: yellow; } (a) red (b) purple (c) orange (d) yellow
12. 12.True or false: a web browser shows line numbers. (a) True (b) False
13. 13.🧭 Is <main> semantic or not semantic? (a) not semantic (b) semantic
14. 14.📊 How many rows does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Mango</td><td>Papaya</td><td>Mango</td><td>Mango</td></tr>
      <tr><td>Jamun</td><td>Guava</td><td>Jamun</td><td>Banana</td></tr>
      <tr><td>Litchi</td><td>Jamun</td><td>Litchi</td><td>Orange</td></tr>
    </table>
15. 15.📱 What does a media query check? (a) the battery level (b) the time of day (c) the page title (d) the screen width
16. 16.🛡️ Online: is it safe to download from pop-ups? (a) safe (b) not safe
17. 17.🧭 Who is helped most by semantic tags? (a) nobody (b) only the server (c) screen-reader users (d) only the printer
18. 18.📊 Which tag makes one data cell? (a) <table> (b) <caption> (c) <td> (d) <th>
19. 19.🔍 Which line is missing its closing tag?
    line 1: <em>Our school trip</em>
    line 2: <h1>My pets
    line 3: <h2>Hello, world!</h2> (a) line 3 (b) line 1 (c) line 2
20. 20.🔢 In a basic web page file, which comes first: “<body>” or “<html>”? (a) <body> (b) <html>
21. 21.⚖️ What colour is the text of this element?
    <h2 class="star" id="intro">Hi</h2>
    CSS:
    .star { color: black; }
    #intro { color: red; } (a) black (b) red (c) yellow (d) white
22. 22.🧭 Why use <nav> instead of <div> for a menu? (a) it adds pictures (b) it makes text red (c) it tells its meaning (d) it loads faster
23. 23.🌈 What is the biggest number one colour can have in rgb()? (a) 255 (b) 100 (c) 99 (d) 1000
24. 24.🌈 Which colour is #0000ff? (a) blue (b) white (c) yellow (d) red
25. 25.⚖️ Which selector is the weakest? (a) an id selector (b) an element selector (c) a class selector
26. 26.🔢 On a typical page, from top to bottom, which comes first: “<header>” or “<footer>”? (a) <header> (b) <footer>
27. 27.⚡ Which JavaScript word repeats code? (a) for (b) let (c) console.log() (d) alert()
28. 28.🎯 What kind of selector is .star? (a) an element selector (b) a class selector (c) an id selector
29. 29.✍️ In color: blue; which part is the value? (a) : (b) ; (c) color (d) blue
30. 30.🌈 Which colour of light is strongest in rgb(1, 153, 96)? (a) green (b) red (c) blue
31. 31.📋 Which list tag shows 1, 2, 3 numbers? (a) <ul> (b) <ol> (c) <li>
32. 32.📄 Where does <link rel="stylesheet"> go: in the head or in the body? (a) in the head (b) in the body
33. 33.⚡ A JavaScript file usually ends with which extension? (a) .js (b) .css (c) .html (d) .jpg
34. 34.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 320px;
      justify-content: center;
    }
    Inside are 3 boxes, each 80px wide (no margins).
35. 35.Which of these is true of <article>? (a) holds extra side notes (b) helps you move around (c) holds the main content (d) holds one blog post
36. 36.📋 Does this list show bullets or numbers?
    <ul>
      <li>Mango</li>
      <li>Papaya</li>
      <li>Grapes</li>
    </ul> (a) bullets (b) numbers
37. 37.What does color do? (a) makes the text bold (b) makes letters bigger (c) colours behind the text (d) sets the letter colour
38. 38.🧩 Which language changes the text size? (a) HTML (b) CSS (c) JavaScript
39. 39.📝 At most, how many of these can be chosen at the same time?
    <form>
      <input type="checkbox" name="fruit"> Litchi
      <input type="checkbox" name="fruit"> Papaya
      <input type="checkbox" name="fruit"> Guava
    </form>
40. 40.💬 How many paragraphs show on the page?
    <p>The red kite</p>
    <p>Rain today</p>
    <!-- <p>Good morning!</p> -->

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