Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 502 · 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 justify-content value puts boxes in the middle? (a) flex-start (b) center (c) flex-end (d) space-between
2. 2.🧭 How many <main> parts should a page have? (a) three (b) ten (c) none (d) one
3. 3.🖌️ What colour are the letters?
   h2 {
     text-align: right;
     color: blue;
     background-color: orange;
     font-size: 12px;
   } (a) orange (b) blue (c) white
4. 4.Which colour pair is hard to read? (a) white on black (b) pink on red (c) white on dark blue (d) black on white
5. 5.💪 How much empty space (px) is before the first box?
   .row {
     display: flex;
     width: 260px;
     justify-content: center;
   }
   Inside are 4 boxes, each 50px wide (no margins).
6. 6.True or false: <meta charset="utf-8"> goes in the body. (a) True (b) False
7. 7.🔁 How many times does this code print “Hello”?
   for (let i = 1; i <= 10; i++) {
     console.log("Hello");
   }
8. 8.✍️ In color: blue; which part is the property? (a) : (b) color (c) blue (d) ;
9. 9.✍️ How does a CSS comment start? (a) <!-- (b) // (c) /* (d) #
10. 10.Which of these is true of <nav>? (a) holds a news story (b) helps you move around (c) is the page’s key part (d) holds the logo and title
11. 11.Which of these does HTML do? (a) makes headings and lists (b) adds space around boxes (c) reacts to a button click (d) sets colours and fonts
12. 12.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 190px;
      padding: 15px;
      border: 2px solid black;
      margin: 15px;
    }
13. 13.📝 Which input type sends the form? (a) number (b) checkbox (c) password (d) submit
14. 14.📋 How many items does this list show?
    <ol>
      <li>Mango</li>
      <li>Guava</li>
      <li>Jamun</li>
      <li>Papaya</li>
    </ol>
15. 15.Which of these has a closing tag? (a) <p> (b) <input> (c) <hr> (d) <br>
16. 16.🔢 On a typical page, from top to bottom, which comes first: “<footer>” or “<main>”? (a) <main> (b) <footer>
17. 17.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 4; i++) {
      total = total + 7;
    }
    console.log(total);
18. 18.🖌️ What colour is behind the letters?
    p {
      background-color: red;
      text-align: center;
      color: orange;
      font-size: 12px;
    } (a) red (b) purple (c) orange
19. 19.True or false: in <img>, alt shows if the image fails. (a) False (b) True
20. 20.True or false: img is an id selector. (a) False (b) True
21. 21.⚡ What does this code show?
    let name = "Aman";
    console.log("Welcome, " + name + "!"); (a) Aman (b) name (c) Welcome, name! (d) Welcome, Aman!
22. 22.🖼️ Which attribute of <img> names the picture file? (a) width (b) alt (c) src (d) height
23. 23.✍️ How many declarations (property: value pairs) are in this rule?
    body {
      color: red;
    }
24. 24.📝 What does <hr> draw? (a) a picture (b) a line across the page (c) a link (d) a table
25. 25.🏷️ Every HTML tag starts with which sign? (a) [ (b) ( (c) < (d) {
26. 26.🧭 Which semantic tag sits at the bottom? (a) <main> (b) <aside> (c) <footer> (d) <header>
27. 27.🔢 In a basic web page file, which comes first: “<body>” or “<html>”? (a) <html> (b) <body>
28. 28.🔢 In a basic web page file, which comes first: “<body>” or “</body>”? (a) </body> (b) <body>
29. 29.💬 Which text will NOT show on the page?
    <p>My pets</p>
    <p>My best friend</p>
    <p>I love mangoes.</p>
    <!-- <p>Good morning!</p> --> (a) My pets (b) I love mangoes. (c) Good morning! (d) My best friend
30. 30.🔠 Which tag is the least important heading? (a) <h3> (b) <p> (c) <h1> (d) <h6>
31. 31.🚀 Where in index.html does the link to style.css go? (a) in the head (b) in the footer (c) after </html> (d) inside a <p>
32. 32.🔗 Which words do you click on?
    <a href="games.html">Visit the site</a> (a) Maths fun (b) Visit the site (c) href (d) games.html
33. 33.⚖️ What colour is the text of this element?
    <h1 class="red" id="top">Hi</h1>
    CSS:
    .red { color: yellow; }
    #top { color: white; }
    h1 { color: purple; } (a) purple (b) yellow (c) white (d) black
34. 34.🔗 Where does this link open?
    <a href="news.html" target="_blank">Art corner</a> (a) in a new tab (b) in the same tab
35. 35.🌗 Is dark grey on white easy or hard to read? (a) easy to read (b) hard to read
36. 36.🚀 Which tag loads script.js into a page? (a) <link script.js> (b) <js src="script.js"> (c) <a href="script.js"> (d) <script src="script.js">
37. 37.🔢 To build and share your first web page, which comes first: “test in a browser” or “publish it online”? (a) test in a browser (b) publish it online
38. 38.True or false: <img> is an empty tag. (a) False (b) True
39. 39.🌈 Which colour is #ff0000? (a) magenta (b) red (c) white (d) blue
40. 40.🔍 Which line is missing its closing tag?
    line 1: <h2>My pets</h2>
    line 2: <em>My best friend</em>
    line 3: <p>I love mangoes. (a) line 1 (b) line 2 (c) line 3

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