Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 769 · 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.📊 How many rows does this table have?
   <table>
     <tr><td>Banana</td><td>Banana</td><td>Mango</td><td>Litchi</td></tr>
     <tr><td>Litchi</td><td>Guava</td><td>Banana</td><td>Litchi</td></tr>
   </table>
2. 2.🖌️ What colour are the letters?
   h2 {
     font-size: 36px;
     background-color: blue;
     color: black;
     text-align: center;
   } (a) orange (b) blue (c) black
3. 3.True or false: the content is the text or picture. (a) True (b) False
4. 4.🚀 You change your code. What should you do to see the change? (a) delete the file (b) save and refresh (c) rename the folder (d) switch off the PC
5. 5.🧩 An opening tag + content + a closing tag together make an ___. (a) attribute (b) element (c) editor (d) address
6. 6.🔍 Which line is missing its closing tag?
   line 1: <i>Rain today</i>
   line 2: <h1>My pets</h1>
   line 3: <em>Fun facts (a) line 1 (b) line 3 (c) line 2
7. 7.🎯 Which element does the selector #main style? (a) <span id="main"> (b) <span id="logo"> (c) <p class="box"> (d) <span class="main">
8. 8.🚀 What is the home page file of a website usually called? (a) start.js (b) index.html (c) main.png (d) home.css
9. 9.💪 How wide (px) is each gap between two boxes?
   .row {
     display: flex;
     width: 380px;
     justify-content: space-between;
   }
   Inside are 3 boxes, each 80px wide (no margins).
10. 10.🛡️ Online: is it safe to use a nickname in games? (a) safe (b) not safe
11. 11.🔢 When you open a web page, which comes LAST? (a) you type the URL (b) DNS finds the server (c) the server sends files (d) the browser shows it
12. 12.🛡️ Online: is it safe to ask before downloading? (a) not safe (b) safe
13. 13.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 5; i++) {
      total = total + 3;
    }
    console.log(total);
14. 14.True or false: a web browser shows pages from the web. (a) False (b) True
15. 15.Which of these is a weak password? (a) Mango#Kite29! (b) Chai$Cup_19x (c) Kite_Fl1es@Dawn (d) iloveyou
16. 16.📊 How many cells does this table have in all?
    <table>
      <tr><th>Name</th><th>Fruit</th></tr>
      <tr><td>Papaya</td><td>Grapes</td></tr>
      <tr><td>Jamun</td><td>Papaya</td></tr>
      <tr><td>Guava</td><td>Mango</td></tr>
    </table>
17. 17.🔠 Which tag is used for the main title on a page? (a) <p> (b) <h1> (c) <h6> (d) <br>
18. 18.⚡ Which JavaScript word runs code when true? (a) let (b) console.log() (c) for (d) if
19. 19.🔠 How many headings are in this code?
    <h1>I love mangoes.</h1>
    <h2>Cricket is fun.</h2>
    <h4>I love mangoes.</h4>
20. 20.📋 Which list tag lists steps in order? (a) <ol> (b) <ul> (c) <li>
21. 21.True or false: HTML on its own cannot make tables. (a) True (b) False
22. 22.Which of these is true of <header>? (a) holds extra side notes (b) sits at the very top (c) holds the main content (d) holds one blog post
23. 23.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 290px;
      padding: 20px;
      border: 1px solid black;
      margin: 5px;
    }
24. 24.True or false: “tiny grey text” makes the page harder to use. (a) True (b) False
25. 25.🎨 What does CSS stand for? (a) Computer Style Sheets (b) Creative Sheet System (c) Cascading Style Sheets (d) Colourful Site Styles
26. 26.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="dog.jpg" alt="A happy dog" width="250"> (a) A happy dog (b) dog.jpg (c) width (d) The full moon
27. 27.📱 The screen is 375px wide. Does the rule inside @media apply?
    p {
      font-size: 24px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 20px;
      }
    } (a) Yes (b) No
28. 28.📝 At most, how many of these can be chosen at the same time?
    <form>
      <input type="radio" name="fruit"> Banana
      <input type="radio" name="fruit"> Guava
      <input type="radio" name="fruit"> Papaya
    </form>
29. 29.📝 Which tag makes a drop-down list? (a) <select> (b) <ol> (c) <li> (d) <ul>
30. 30.📝 How many paragraphs does this code make?
    <p>Our school trip</p>
    <p>My pets</p>
    <p>My best friend</p>
31. 31.True or false: CSS lays out the page. (a) False (b) True
32. 32.🔠 How many heading levels does HTML have? (a) 4 (b) 6 (c) 3 (d) 10
33. 33.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 40px;
      padding: 25px;
      border: 4px solid black;
      margin: 5px;
    }
34. 34.📝 Does <b> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
35. 35.♿ Does this help everyone, or make the page harder to use: write clear link text? (a) makes it harder (b) helps everyone
36. 36.📊 How many cells does this table have in all?
    <table>
      <tr><td>Banana</td><td>Jamun</td><td>Grapes</td></tr>
      <tr><td>Guava</td><td>Jamun</td><td>Litchi</td></tr>
      <tr><td>Orange</td><td>Mango</td><td>Orange</td></tr>
      <tr><td>Mango</td><td>Jamun</td><td>Guava</td></tr>
    </table>
37. 37.💬 Which text will NOT show on the page?
    <!-- <p>Fun facts</p> -->
    <p>My pets</p>
    <p>Good morning!</p> (a) Good morning! (b) My pets (c) Fun facts
38. 38.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 240px;
      justify-content: flex-end;
    }
    Inside are 2 boxes, each 80px wide (no margins).
39. 39.What does justify-content: center do? (a) packs boxes at the start (b) equal gaps, none at ends (c) puts boxes in the middle (d) packs boxes at the end
40. 40.True or false: let score = 0; goes in index.html. (a) True (b) False

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