Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 18 · 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 element does the selector .red style? (a) <li class="star"> (b) <h2 class="box"> (c) <h2 id="red"> (d) <h2 class="red">
2. 2.True or false: <hr> is an empty tag. (a) False (b) True
3. 3.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 240px;
     padding: 25px;
     border: 2px solid black;
     margin: 5px;
   }
4. 4.True or false: the server is the page’s address. (a) True (b) False
5. 5.✍️ What is the selector in this CSS rule?
   #top {
     width: 300px;
     text-align: center;
     background-color: yellow;
     color: red;
   } (a) #top (b) center (c) li (d) width
6. 6.🌗 Is red on green easy or hard to read? (a) hard to read (b) easy to read
7. 7.🔠 Which tag is used for the main title on a page? (a) <h1> (b) <br> (c) <h6> (d) <p>
8. 8.🎯 Which sign starts an id selector? (a) & (b) . (c) # (d) @
9. 9.📝 On how many lines does the browser show this paragraph?
   <p>Sky is blue<br>Roses are red<br>Stars shine<br>Rivers flow</p>
10. 10.💬 Why do coders write comments? (a) to add colour (b) to make links (c) to leave notes (d) to show pictures
11. 11.💬 How does an HTML comment start? (a) # (b) // (c) <!-- (d) /*
12. 12.True or false: margin is space outside the border. (a) False (b) True
13. 13.📝 On how many lines does the browser show this paragraph?
    <p>Stars shine<br>Roses are red<br>Kites fly high<br>Sky is blue</p>
14. 14.📱 The screen is 700px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 10px;
      }
    } (a) No (b) Yes
15. 15.📝 Does <p> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
16. 16.📋 Does this list show bullets or numbers?
    <ul>
      <li>Papaya</li>
      <li>Mango</li>
    </ul> (a) bullets (b) numbers
17. 17.🔗 Which words do you click on?
    <a href="about.html">Take the quiz</a> (a) about.html (b) Play games (c) href (d) Take the quiz
18. 18.⚖️ What colour is the text of this element?
    <p class="note" id="intro">Hi</p>
    CSS:
    .note { color: black; }
    .note { color: orange; } (a) blue (b) black (c) white (d) orange
19. 19.True or false: the server asks for a web page. (a) False (b) True
20. 20.Which of these is a strong password? (a) 123456 (b) qwerty (c) abcd1234 (d) Rain#Drop_42!
21. 21.🔍 Which is the odd one out? (a) shows pages from the web (b) opens web pages for us (c) sends pages over the net (d) has an address bar
22. 22.Which of these is true of <article>? (a) holds the menu of links (b) holds the main content (c) holds one blog post (d) sits at the bottom
23. 23.🔢 On a typical page, from top to bottom, which comes first: “<header>” or “<nav>”? (a) <header> (b) <nav>
24. 24.📊 Which tag makes one data cell? (a) <table> (b) <td> (c) <tr> (d) <caption>
25. 25.🛡️ Before typing a password on a site, check the address starts with ___. (a) http (b) https (c) ftp (d) www
26. 26.🎨 What does CSS stand for? (a) Cascading Style Sheets (b) Computer Style Sheets (c) Colourful Site Styles (d) Creative Sheet System
27. 27.🌈 What is the biggest number one colour can have in rgb()? (a) 99 (b) 1000 (c) 255 (d) 100
28. 28.What does justify-content: flex-end do? (a) equal gaps, none at ends (b) packs boxes at the start (c) puts boxes in the middle (d) packs boxes at the end
29. 29.🌈 In #250000 the red part is the hex number 25. What is it as a normal number?
30. 30.True or false: HTML on its own cannot make headings. (a) True (b) False
31. 31.📝 Which input type is for an email address? (a) number (b) checkbox (c) submit (d) email
32. 32.⚖️ Two rules with the same selector set a colour. Which one wins? (a) the first one (b) neither (c) the shorter one (d) the later one
33. 33.📝 Which tag holds a whole form? (a) <form> (b) <table> (c) <input> (d) <ol>
34. 34.🔢 On a typical page, from top to bottom, which comes FIRST? (a) <header> (b) <footer> (c) <main> (d) <nav>
35. 35.True or false: CSS checks a quiz answer. (a) False (b) True
36. 36.📋 Which list shows the steps of a recipe best? (a) <ul> (b) <br> (c) <hr> (d) <ol>
37. 37.💬 How many paragraphs show on the page?
    <p>Good morning!</p>
    <!-- <p>Rain today</p> -->
    <!-- <p>I love mangoes.</p> -->
    <p>The red kite</p>
38. 38.🔁 Which loop repeats code a set number of times? (a) let (b) if (c) for (d) else
39. 39.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="fort.jpg" alt="An old fort" width="300"> (a) fort.jpg (b) width (c) An old fort (d) A tiger asleep
40. 40.True or false: in <img>, src names the picture file. (a) True (b) False

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