Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 972 · 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 CSS selector matches this element?
   <p class="big" id="hero">Hello</p> (a) .hero (b) #top (c) p (d) #big
2. 2.⚡ What does this code show?
   let name = "Kabir";
   alert("Hello, " + name + "!"); (a) Hello, name! (b) Kabir (c) name (d) Hello, Kabir!
3. 3.🔗 Which words do you click on?
   <a href="contact.html">Play games</a> (a) Play games (b) contact.html (c) About us (d) href
4. 4.🏷️ Is <h1> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
5. 5.⚖️ What colour is the text of this element?
   <h2 class="big" id="intro">Hi</h2>
   CSS:
   #intro { color: green; }
   #intro { color: white; } (a) green (b) orange (c) white (d) blue
6. 6.🔗 Which address opens when you click this link?
   <a href="about.html">About us</a> (a) https://example.com (b) contact.html (c) about.html (d) About us
7. 7.🔢 To build and share your first web page, which comes LAST? (a) publish it online (b) test in a browser (c) plan what to show (d) add CSS styles
8. 8.True or false: <b> has a closing tag. (a) False (b) True
9. 9.🛡️ Before typing a password on a site, check the address starts with ___. (a) www (b) http (c) https (d) ftp
10. 10.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is fast (b) the data is scrambled (c) the site is a game (d) the site is free
11. 11.True or false: #top { color: blue; } goes in style.css. (a) True (b) False
12. 12.True or false: <h1> has a closing tag. (a) False (b) True
13. 13.🌈 Which hex code is black? (a) #00ff00 (b) #0000ff (c) #000000 (d) #ffffff
14. 14.🖼️ Which picture file does the browser load?
    <img src="moon.png" alt="The full moon" width="350"> (a) The full moon (b) bus.jpg (c) fort.jpg (d) moon.png
15. 15.📊 How many cells does this table have in all?
    <table>
      <tr><td>Jamun</td><td>Guava</td><td>Guava</td><td>Guava</td></tr>
      <tr><td>Mango</td><td>Banana</td><td>Litchi</td><td>Litchi</td></tr>
      <tr><td>Grapes</td><td>Orange</td><td>Mango</td><td>Jamun</td></tr>
      <tr><td>Litchi</td><td>Mango</td><td>Grapes</td><td>Jamun</td></tr>
    </table>
16. 16.🔁 What does this code print?
    let age = 8;
    if (age >= 26) {
      console.log("teen");
    } else {
      console.log("child");
    } (a) child (b) teen
17. 17.🏷️ Which is the closing tag for <u>? (a) <\u> (b) <u/> (c) </u> (d) <u>
18. 18.📱 max-width: 600px applies when the screen is ___. (a) 600px or narrower (b) 600px or wider (c) exactly 1000px (d) turned off
19. 19.True or false: <meta charset="utf-8"> goes in the body. (a) False (b) True
20. 20.🚀 Which file is best for code that reacts to clicks? (a) index.html (b) script.js (c) style.css (d) notes.txt
21. 21.🌍 Which one asks for a web page? (a) the server (b) the browser (c) the URL (d) HTTPS
22. 22.🔠 Which tag is used for the main title on a page? (a) <h6> (b) <br> (c) <p> (d) <h1>
23. 23.📄 What is the first line of an HTML5 page? (a) <!DOCTYPE html> (b) <html> (c) <body> (d) <head>
24. 24.💬 How does an HTML comment end? (a) --> (b) // (c) */ (d) >>
25. 25.True or false: score = score + 1; goes in style.css. (a) False (b) True
26. 26.📱 The screen is 1100px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 16px;
      }
    }
27. 27.📋 How many items does this list show?
    <ol>
      <li>Litchi</li>
      <li>Orange</li>
      <li>Papaya</li>
      <li>Mango</li>
    </ol>
28. 28.Which of these is an opening tag? (a) </h1> (b) </title> (c) <body> (d) </body>
29. 29.🔠 How many <h1> headings should a page usually have? (a) 10 (b) 6 (c) 1 (d) 3
30. 30.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 240px;
      justify-content: center;
    }
    Inside are 2 boxes, each 40px wide (no margins).
31. 31.♿ Does this help everyone, or make the page harder to use: use big enough text? (a) helps everyone (b) makes it harder
32. 32.🎯 Which CSS selector matches this element?
    <div class="box" id="intro">Hello</div> (a) .intro (b) .star (c) #box (d) div
33. 33.🌈 Which colour of light is strongest in rgb(227, 115, 139)? (a) green (b) blue (c) red
34. 34.🌍 What is the path in this URL?
    http://learn.example.com/news/today.html (a) /news/today.html (b) /games/chess.html (c) http (d) learn.example.com
35. 35.Which of these is safe to do online? (a) share your OTP (b) think before you post (c) post your home address (d) type a password on http
36. 36.🔍 Which is the odd one out? (a) sends pages over the net (b) answers page requests (c) stores a website’s files (d) has an address bar
37. 37.🖼️ Which attribute of <img> sets how wide it is? (a) src (b) alt (c) width (d) height
38. 38.⚡ Where does console.log() show its output? (a) in the console (b) on the printer (c) on the title bar (d) in the address bar
39. 39.💪 Which flexbox property turns on flexbox? (a) flex-direction (b) align-items (c) gap (d) display: flex
40. 40.🔠 How many headings are in this code?
    <h1>I love mangoes.</h1>
    <h2>Our school trip</h2>
    <p>Fun facts</p>

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