Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 68 · 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 a closing tag have that an opening tag does not? (a) a slash / (b) a hash # (c) a dollar $ (d) a dot .
2. 2.⚡ What number does this code print?
   let runs = 12;
   runs = runs + 15;
   runs = runs - 12;
   console.log(runs);
3. 3.✍️ What value is given to color in this rule?
   .note {
     color: red;
     font-style: italic;
   } (a) 20px (b) color (c) red (d) center
4. 4.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <nav> (b) <main> (c) <footer>
5. 5.True or false: <li> is one item of a list. (a) False (b) True
6. 6.⚖️ What colour is the text of this element?
   <p class="box" id="intro">Hi</p>
   CSS:
   p { color: orange; }
   .box { color: red; } (a) orange (b) blue (c) black (d) red
7. 7.🏷️ Is </h1> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
8. 8.🔁 Which loop repeats code a set number of times? (a) for (b) let (c) if (d) else
9. 9.🚀 You change your code. What should you do to see the change? (a) delete the file (b) rename the folder (c) switch off the PC (d) save and refresh
10. 10.🛡️ A pop-up says you won a prize and asks for your password. What do you do? (a) share it with friends (b) type the password (c) close it, tell an adult (d) click it twice
11. 11.🔁 How many numbers does this code print?
    for (let i = 0; i < 18; i = i + 2) {
      console.log(i);
    }
12. 12.✍️ How many declarations (property: value pairs) are in this rule?
    p {
      text-align: center;
      font-size: 20px;
      background-color: yellow;
    }
13. 13.📋 Does this list show bullets or numbers?
    <ul>
      <li>Guava</li>
      <li>Mango</li>
      <li>Papaya</li>
    </ul> (a) bullets (b) numbers
14. 14.🌈 Hex digits go 0 to 9, then A to which letter? (a) Z (b) J (c) G (d) F
15. 15.🎯 What kind of selector is #logo? (a) an element selector (b) a class selector (c) an id selector
16. 16.True or false: <input type="text"> hides what you type. (a) False (b) True
17. 17.🧭 Is <footer> semantic or not semantic? (a) semantic (b) not semantic
18. 18.🖼️ How many pixels wide is the picture drawn?
    <img src="moon.png" alt="The full moon" width="300">
19. 19.⚡ What does this code print? (Look at the quotes!)
    let x = "2";
    let y = 9;
    console.log(x + y); (a) Error (b) 11 (c) 29
20. 20.🔠 How many <h1> headings should a page usually have? (a) 10 (b) 1 (c) 6 (d) 3
21. 21.♿ A part of the page is under a <h3> heading. Which tag should its sub-heading use? (a) <h3> (b) <h1> (c) <h4> (d) <h2>
22. 22.Which of these goes in the body? (a) <h1> (b) <title> (c) <style> (d) <link rel="stylesheet">
23. 23.What does justify-content: flex-end do? (a) puts boxes in the middle (b) equal gaps, none at ends (c) packs boxes at the start (d) packs boxes at the end
24. 24.🚀 Should file names have spaces, like my page.html? (a) No (b) Yes
25. 25.✍️ Which sign ends each CSS declaration? (a) : (b) . (c) ; (d) ,
26. 26.What does color do? (a) sets the letter colour (b) makes the text bold (c) picks the font style (d) colours behind the text
27. 27.📊 Which tag gives the table a title? (a) <table> (b) <tr> (c) <td> (d) <caption>
28. 28.🔗 Which address opens when you click this link?
    <a href="art.html">Art corner</a> (a) Art corner (b) art.html (c) quiz.html (d) news.html
29. 29.🏷️ Which is the closing tag for <h1>? (a) <\h1> (b) <h1/> (c) </h1> (d) <h1>
30. 30.What does font-family do? (a) sets the letter colour (b) colours behind the text (c) makes letters bigger (d) picks the font style
31. 31.True or false: <p>Hello!</p> goes in index.html. (a) True (b) False
32. 32.🔍 One closing tag is missing. Which one?
    <u>My best friend
    <h1>Fun facts</h1>
    <h3>The red kite</h3> (a) </h3> (b) </em> (c) </h1> (d) </u>
33. 33.💬 How does an HTML comment start? (a) // (b) /* (c) <!-- (d) #
34. 34.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 250px;
      justify-content: flex-start;
    }
    Inside are 2 boxes, each 100px wide (no margins).
35. 35.🌈 Which colour of light is strongest in rgb(14, 170, 38)? (a) red (b) blue (c) green
36. 36.🛡️ Is it safe to use the same password on every site? (a) No (b) Yes
37. 37.Which of these is true of <footer>? (a) holds extra side notes (b) holds the main content (c) is the page’s key part (d) holds copyright notes
38. 38.🎨 A CSS file usually ends with which extension? (a) .js (b) .html (c) .png (d) .css
39. 39.Which of these does HTML do? (a) shows a pop-up message (b) makes a link (c) adds space around boxes (d) reacts to a button click
40. 40.🏷️ Is <p> an opening tag or a closing tag? (a) a closing tag (b) an opening tag

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