Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 893 · 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.🔗 Where does this link open?
   <a href="news.html">Contact us</a> (a) in a new tab (b) in the same tab
2. 2.True or false: CSS makes headings and lists. (a) False (b) True
3. 3.🏷️ Is </title> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
4. 4.💪 How much empty space (px) is left after the last box?
   .row {
     display: flex;
     width: 450px;
     justify-content: flex-start;
   }
   Inside are 4 boxes, each 100px wide (no margins).
5. 5.🧩 Which language makes a link? (a) HTML (b) JavaScript (c) CSS
6. 6.Which of these has a closing tag? (a) <meta> (b) <input> (c) <b> (d) <img>
7. 7.📱 The screen is 1100px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 24px;
   }
   @media (min-width: 600px) {
     p {
       font-size: 26px;
     }
   }
8. 8.🎯 Which sign starts a class selector? (a) @ (b) & (c) # (d) .
9. 9.Which of these is true of <main>? (a) sits at the very top (b) holds the main content (c) holds one blog post (d) holds extra side notes
10. 10.📱 max-width: 600px applies when the screen is ___. (a) 600px or wider (b) turned off (c) 600px or narrower (d) exactly 1000px
11. 11.True or false: body is an id selector. (a) False (b) True
12. 12.🌈 Which hex code is blue? (a) #ff0000 (b) #0000ff (c) #ff00ff (d) #00ffff
13. 13.📝 Which input type hides what you type? (a) password (b) text (c) checkbox (d) number
14. 14.🌈 Which colour of light is strongest in rgb(17, 14, 177)? (a) red (b) green (c) blue
15. 15.True or false: <table> holds the whole table. (a) False (b) True
16. 16.📊 How many cells does this table have in all?
    <table>
      <tr><td>Jamun</td><td>Guava</td></tr>
      <tr><td>Banana</td><td>Papaya</td></tr>
    </table>
17. 17.🖼️ How many pixels wide is the picture drawn?
    <img src="kite.png" alt="A red kite" width="50">
18. 18.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="moon.png" alt="The full moon" width="150"> (a) width (b) The full moon (c) moon.png (d) Our school bus
19. 19.🔁 Which word runs code only when something is true? (a) for (b) let (c) log (d) if
20. 20.📝 How many paragraphs does this code make?
    <p>The red kite</p>
    <h2>I love mangoes.</h2>
    <p>Good morning!</p>
21. 21.🌍 What does a web address (URL) tell the browser? (a) how old you are (b) your password (c) where the page is (d) the page colour
22. 22.Which of these goes in the body? (a) <table> (b) <meta charset="utf-8"> (c) <style> (d) <title>
23. 23.📱 The screen is 700px wide. Does the rule inside @media apply?
    p {
      font-size: 20px;
    }
    @media (min-width: 1024px) {
      p {
        font-size: 22px;
      }
    } (a) Yes (b) No
24. 24.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h2> → <h4> (a) No (b) Yes
25. 25.True or false: the URL is the page’s address. (a) False (b) True
26. 26.🔁 What does this code print?
    let temp = 48;
    if (temp >= 45) {
      console.log("Hot");
    } else {
      console.log("Cool");
    } (a) Hot (b) Cool
27. 27.📋 Which list tag lists steps in order? (a) <li> (b) <ul> (c) <ol>
28. 28.🚀 Which tag loads script.js into a page? (a) <script src="script.js"> (b) <a href="script.js"> (c) <js src="script.js"> (d) <link script.js>
29. 29.🔠 Which heading shows the SMALLEST text: <h2>, <h5>, <h4> or <h3>? (a) <h3> (b) <h2> (c) <h4> (d) <h5>
30. 30.⚖️ Which selector is the strongest? (a) an id selector (b) a class selector (c) an element selector
31. 31.💪 Which flexbox property turns on flexbox? (a) align-items (b) justify-content (c) flex-direction (d) display: flex
32. 32.True or false: <ol> lists steps in order. (a) True (b) False
33. 33.♿ Who uses a screen reader? (a) only teachers (b) only coders (c) people who are blind (d) only robots
34. 34.⚖️ What colour is the text of this element?
    <h2 class="note" id="intro">Hi</h2>
    CSS:
    .note { color: blue; }
    #intro { color: black; }
    h2 { color: purple; } (a) black (b) yellow (c) purple (d) blue
35. 35.💬 Which text will NOT show on the page?
    <!-- <p>I love mangoes.</p> -->
    <p>The red kite</p>
    <p>Rain today</p>
    <p>Good morning!</p> (a) Good morning! (b) The red kite (c) I love mangoes. (d) Rain today
36. 36.📱 The screen is 1366px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 12px;
      }
    } (a) Yes (b) No
37. 37.🔗 Which tag makes a clickable link? (a) <p> (b) <img> (c) <link> (d) <a>
38. 38.📋 What number does the browser show next to “Grapes”?
    <ol>
      <li>Litchi</li>
      <li>Grapes</li>
      <li>Jamun</li>
      <li>Banana</li>
      <li>Mango</li>
      <li>Orange</li>
    </ol>
39. 39.🔠 Which heading shows the BIGGEST text: <h1>, <h5>, <h2> or <h4>? (a) <h2> (b) <h1> (c) <h4> (d) <h5>
40. 40.📊 How many rows does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Banana</td><td>Banana</td><td>Mango</td><td>Banana</td></tr>
      <tr><td>Jamun</td><td>Orange</td><td>Mango</td><td>Papaya</td></tr>
      <tr><td>Grapes</td><td>Jamun</td><td>Banana</td><td>Orange</td></tr>
    </table>

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