Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 632 · 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.What does background-color do? (a) sets the letter colour (b) makes the text bold (c) centres a heading (d) colours behind the text
2. 2.🖼️ How many pixels wide is the picture drawn?
   <img src="moon.png" alt="The full moon" width="200">
3. 3.Which colour pair is easy to read? (a) red on green (b) white on dark blue (c) pink on red (d) yellow on white
4. 4.💬 Can anyone read your comments by viewing the page source? (a) No (b) Yes
5. 5.📱 The screen is 320px wide. Does the rule inside @media apply?
   p {
     font-size: 16px;
   }
   @media (min-width: 768px) {
     p {
       font-size: 20px;
     }
   } (a) Yes (b) No
6. 6.🌈 What is the biggest number one colour can have in rgb()? (a) 1000 (b) 100 (c) 255 (d) 99
7. 7.Which of these goes in the body? (a) <style> (b) <meta charset="utf-8"> (c) <a> (d) <link rel="stylesheet">
8. 8.📝 Which input type lets you tick many? (a) submit (b) password (c) number (d) checkbox
9. 9.📊 How many heading cells (<th>) does this table have?
   <table>
     <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
     <tr><td>Mango</td><td>Banana</td><td>Jamun</td><td>Banana</td></tr>
     <tr><td>Orange</td><td>Jamun</td><td>Grapes</td><td>Banana</td></tr>
     <tr><td>Mango</td><td>Litchi</td><td>Grapes</td><td>Litchi</td></tr>
   </table>
10. 10.🖼️ Which attribute of <img> is read by screen readers? (a) src (b) alt (c) height (d) width
11. 11.🌐 Which one hosts websites online? (a) a web browser (b) a web server (c) a code editor
12. 12.🖼️ Which picture file does the browser load?
    <img src="tiger.jpg" alt="A tiger asleep" width="50"> (a) tiger.jpg (b) kite.png (c) A tiger asleep (d) map.png
13. 13.🌈 Which colour is #ff0000? (a) red (b) cyan (c) blue (d) magenta
14. 14.🏷️ Is <title> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
15. 15.✍️ How many declarations (property: value pairs) are in this rule?
    h2 {
      font-size: 20px;
    }
16. 16.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 140px;
      padding: 5px;
      border: 4px solid black;
      margin: 20px;
    }
17. 17.🌍 What is the protocol in this URL?
    http://www.example.com/about.html (a) www.example.com (b) https (c) /about.html (d) http
18. 18.🖼️ Which attribute of <img> describes the picture? (a) alt (b) src (c) width (d) height
19. 19.🔢 To build and share your first web page, which comes LAST? (a) add CSS styles (b) write the HTML (c) publish it online (d) plan what to show
20. 20.📄 Can HTML on its own make links to pages? (a) Yes (b) No
21. 21.True or false: margin is space outside the border. (a) True (b) False
22. 22.✍️ Which property is set to italic in this rule?
    h2 {
      font-weight: bold;
      border: 2px solid;
      margin: 10px;
      font-style: italic;
    } (a) color (b) italic (c) font-style (d) font-size
23. 23.True or false: JavaScript checks a quiz answer. (a) True (b) False
24. 24.📋 Which list shows the steps of a recipe best? (a) <ul> (b) <br> (c) <hr> (d) <ol>
25. 25.💪 Which justify-content value puts boxes in the middle? (a) space-between (b) center (c) flex-start (d) flex-end
26. 26.🧭 How many <main> parts should a page have? (a) three (b) one (c) ten (d) none
27. 27.Which of these does HTML do? (a) sets colours and fonts (b) changes the text size (c) checks a quiz answer (d) makes a form box
28. 28.🖌️ What colour is behind the letters?
    h2 {
      text-align: center;
      color: orange;
      font-size: 36px;
      background-color: green;
    } (a) green (b) black (c) orange
29. 29.💬 Which text will NOT show on the page?
    <p>Rain today</p>
    <!-- <p>Fun facts</p> -->
    <p>Hello, world!</p> (a) Hello, world! (b) Fun facts (c) Rain today
30. 30.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 16px;
      }
    }
31. 31.📝 Does <title> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
32. 32.🔢 To build and share your first web page, which comes first: “test in a browser” or “publish it online”? (a) publish it online (b) test in a browser
33. 33.💬 How many paragraphs show on the page?
    <p>I love mangoes.</p>
    <!-- <p>Cricket is fun.</p> -->
    <p>Rain today</p>
    <p>The red kite</p>
34. 34.True or false: <style> goes in the body. (a) True (b) False
35. 35.True or false: <caption> gives the table a title. (a) False (b) True
36. 36.🛡️ Before typing a password on a site, check the address starts with ___. (a) www (b) ftp (c) http (d) https
37. 37.🔁 How many numbers does this code print?
    for (let i = 0; i < 19; i = i + 4) {
      console.log(i);
    }
38. 38.🛡️ Should you share your password with your best friend? (a) No (b) Yes
39. 39.✍️ What value is given to width in this rule?
    .note {
      width: 300px;
      margin: 10px;
    } (a) width (b) italic (c) 300px (d) red
40. 40.🧩 Which language rounds box corners? (a) HTML (b) CSS (c) JavaScript

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