Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 385 · 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 <br> do? (a) makes a list (b) makes text bold (c) adds a picture (d) starts a new line
2. 2.💬 Why do coders write comments? (a) to make links (b) to show pictures (c) to add colour (d) to leave notes
3. 3.🖼️ Which picture file does the browser load?
   <img src="fort.jpg" alt="An old fort" width="150"> (a) fort.jpg (b) An old fort (c) kite.png (d) tiger.jpg
4. 4.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 150px;
     padding: 30px;
     border: 4px solid black;
     margin: 20px;
   }
5. 5.🔗 Which words do you click on?
   <a href="news.html">School news</a> (a) School news (b) news.html (c) Take the quiz (d) href
6. 6.🌐 Which one sends pages over the net? (a) a web browser (b) a web server (c) a code editor
7. 7.💪 Which flexbox property lines boxes up across? (a) justify-content (b) gap (c) align-items (d) display: flex
8. 8.🔍 Which line is missing its closing tag?
   line 1: <p>My pets
   line 2: <em>The red kite</em>
   line 3: <strong>Good morning!</strong> (a) line 2 (b) line 3 (c) line 1
9. 9.🔠 Which heading shows the BIGGEST text: <h6>, <h1>, <h2> or <h3>? (a) <h2> (b) <h1> (c) <h6> (d) <h3>
10. 10.Which of these has a closing tag? (a) <h1> (b) <hr> (c) <meta> (d) <img>
11. 11.🔠 Which heading shows the BIGGEST text: <h1>, <h4>, <h2> or <h6>? (a) <h2> (b) <h6> (c) <h1> (d) <h4>
12. 12.⚖️ What colour is the text of this element?
    <p class="menu" id="main">Hi</p>
    CSS:
    #main { color: black; }
    #main { color: blue; } (a) black (b) purple (c) white (d) blue
13. 13.✍️ Which property is set to 8px in this rule?
    li {
      background-color: yellow;
      padding: 8px;
      width: 300px;
    } (a) padding (b) border (c) font-weight (d) 8px
14. 14.Which of these is margin? (a) a solid or dotted edge (b) the gap to other boxes (c) space inside the border (d) the text or picture
15. 15.🖌️ How big is the text, in px?
    h2 {
      text-align: left;
      color: red;
      font-size: 20px;
      background-color: yellow;
    }
16. 16.Which of these is true of a web server? (a) turns HTML into a page (b) opens web pages for us (c) shows pages from the web (d) sends pages over the net
17. 17.True or false: h1 { font-size: 32px; } goes in style.css. (a) False (b) True
18. 18.True or false: “use headings in order” makes the page harder to use. (a) False (b) True
19. 19.💬 Which text will NOT show on the page?
    <!-- <p>Good morning!</p> -->
    <p>Cricket is fun.</p>
    <p>Our school trip</p> (a) Good morning! (b) Our school trip (c) Cricket is fun.
20. 20.✍️ In color: blue; which part is the value? (a) blue (b) color (c) : (d) ;
21. 21.True or false: to check for https first is safe. (a) False (b) True
22. 22.True or false: “colour as the only clue” makes the page harder to use. (a) True (b) False
23. 23.🚀 Which file should this code go in: h1 { font-size: 32px; } (a) index.html (b) style.css (c) script.js
24. 24.🎯 Which sign starts a class selector? (a) . (b) # (c) & (d) @
25. 25.🔠 Which heading shows the BIGGEST text: <h1>, <h2>, <h4> or <h3>? (a) <h2> (b) <h4> (c) <h3> (d) <h1>
26. 26.🔠 How many heading levels does HTML have? (a) 10 (b) 4 (c) 3 (d) 6
27. 27.True or false: to type a password on http is not safe. (a) False (b) True
28. 28.⚖️ What colour is the text of this element?
    <h2 class="big" id="end">Hi</h2>
    CSS:
    #end { color: red; }
    h2 { color: yellow; }
    .big { color: black; } (a) black (b) red (c) yellow (d) green
29. 29.Which of these has a closing tag? (a) <title> (b) <input> (c) <img> (d) <meta>
30. 30.🌈 In #rrggbb, which colour do the last two digits give? (a) blue (b) green (c) red (d) white
31. 31.🧭 How many <main> parts should a page have? (a) none (b) three (c) ten (d) one
32. 32.✍️ What value is given to font-size in this rule?
    li {
      background-color: yellow;
      font-size: 20px;
      font-style: italic;
      border: 2px solid;
    } (a) yellow (b) 20px (c) center (d) font-size
33. 33.🌍 What is the domain name in this URL?
    https://kids.example.org/art/gallery.html (a) https (b) /art/gallery.html (c) kids.example.org (d) school.example.in
34. 34.🔠 How many headings are in this code?
    <h1>I love mangoes.</h1>
    <h3>Rain today</h3>
    <p>Rain today</p>
    <h2>My pets</h2>
    <h3>Good morning!</h3>
35. 35.True or false: p is a class selector. (a) True (b) False
36. 36.🖼️ Does <img> need a closing tag? (a) Yes (b) No
37. 37.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 180px;
      padding: 20px;
      border: 4px solid black;
      margin: 20px;
    }
38. 38.📋 Which list shows the steps of a recipe best? (a) <br> (b) <ol> (c) <hr> (d) <ul>
39. 39.Which of these is true of <main>? (a) holds a side box of tips (b) holds the main content (c) helps you move around (d) sits at the very top
40. 40.📄 Where does <meta charset="utf-8"> go: in the head or in the body? (a) in the body (b) in the head

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