Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 854 · 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.🖼️ How many pixels wide is the picture drawn?
   <img src="map.png" alt="Map of India" width="400">
2. 2.What does justify-content: center do? (a) packs boxes at the end (b) puts boxes in the middle (c) equal gaps, none at ends (d) packs boxes at the start
3. 3.⚡ What number does this code print?
   let coins = 25;
   coins = coins + 14;
   coins = coins - 4;
   console.log(coins);
4. 4.🔁 Which loop repeats code a set number of times? (a) else (b) if (c) for (d) let
5. 5.⚖️ What colour is the text of this element?
   <h1 class="box" id="hero">Hi</h1>
   CSS:
   #hero { color: green; }
   #hero { color: black; } (a) white (b) purple (c) green (d) black
6. 6.True or false: <ul> goes inside ul or ol. (a) True (b) False
7. 7.💬 Which text will NOT show on the page?
   <!-- <p>The red kite</p> -->
   <p>I love mangoes.</p>
   <p>Our school trip</p>
   <p>Cricket is fun.</p> (a) Our school trip (b) The red kite (c) I love mangoes. (d) Cricket is fun.
8. 8.📋 Which list tag is an ordered list? (a) <ol> (b) <li> (c) <ul>
9. 9.💬 Which text will NOT show on the page?
   <p>Cricket is fun.</p>
   <!-- <p>Good morning!</p> -->
   <p>My best friend</p> (a) My best friend (b) Cricket is fun. (c) Good morning!
10. 10.💬 Can anyone read your comments by viewing the page source? (a) Yes (b) No
11. 11.Which of these is a closing tag? (a) <li> (b) </title> (c) <body> (d) <p>
12. 12.🚀 Which file should this code go in: alert(score); (a) index.html (b) script.js (c) style.css
13. 13.🏷️ Is </b> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
14. 14.⚡ What number does this code print?
    let a = 40;
    let b = 39;
    console.log(a + b);
15. 15.True or false: <p> has a closing tag. (a) True (b) False
16. 16.🌈 Which hex code is bright green? (a) #ffff00 (b) #00ff00 (c) #000000 (d) #0000ff
17. 17.⚡ Which JavaScript word runs code when true? (a) console.log() (b) alert() (c) if (d) let
18. 18.🖼️ Which picture file does the browser load?
    <img src="kite.png" alt="A red kite" width="50"> (a) A red kite (b) cake.jpg (c) map.png (d) kite.png
19. 19.📛 In <a href="x.html">, what is href? (a) a comment (b) a closing tag (c) an element name (d) an attribute
20. 20.True or false: in <img>, width sets how wide it is. (a) False (b) True
21. 21.🖌️ Which CSS property colours behind the text? (a) font-weight (b) background-color (c) font-family (d) color
22. 22.✍️ What value is given to text-align in this rule?
    h2 {
      text-align: center;
      background-color: yellow;
    } (a) text-align (b) yellow (c) 10px (d) center
23. 23.🔢 To build and share your first web page, which comes FIRST? (a) add CSS styles (b) publish it online (c) test in a browser (d) plan what to show
24. 24.💬 How many paragraphs show on the page?
    <!-- <p>My pets</p> -->
    <!-- <p>Our school trip</p> -->
    <p>I love mangoes.</p>
    <!-- <p>The red kite</p> -->
    <p>Hello, world!</p>
25. 25.🖼️ Which attribute of <img> is read by screen readers? (a) width (b) src (c) alt (d) height
26. 26.🔍 Which is the odd one out? (a) hosts websites online (b) is where we type code (c) answers page requests (d) sends pages over the net
27. 27.🌈 In #rrggbb, which colour do the last two digits give? (a) red (b) white (c) green (d) blue
28. 28.🔗 Which words do you click on?
    <a href="art.html">Visit the site</a> (a) Maths fun (b) art.html (c) Visit the site (d) href
29. 29.📄 Where does <style> go: in the head or in the body? (a) in the head (b) in the body
30. 30.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="cake.jpg" alt="Birthday cake" width="50"> (a) width (b) Birthday cake (c) A happy dog (d) cake.jpg
31. 31.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <footer> (b) <nav> (c) <main>
32. 32.📊 How many cells are in each row?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Papaya</td><td>Banana</td><td>Mango</td><td>Guava</td></tr>
      <tr><td>Jamun</td><td>Grapes</td><td>Banana</td><td>Papaya</td></tr>
    </table>
33. 33.📱 The screen is 700px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 24px;
    }
    @media (max-width: 600px) {
      p {
        font-size: 20px;
      }
    }
34. 34.📱 The screen is 700px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 10px;
      }
    } (a) No (b) Yes
35. 35.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 320px;
      justify-content: center;
    }
    Inside are 3 boxes, each 100px wide (no margins).
36. 36.True or false: <caption> makes one table row. (a) True (b) False
37. 37.🖼️ Which attribute of <img> tells which image to load? (a) src (b) alt (c) height (d) width
38. 38.🛡️ Online: is it safe to keep passwords secret? (a) not safe (b) safe
39. 39.🔗 Where does this link open?
    <a href="quiz.html" target="_blank">Maths fun</a> (a) in the same tab (b) in a new tab
40. 40.🔒 What does the lock (HTTPS) in the address bar mean? (a) the data is scrambled (b) the site is free (c) the site is a game (d) the site is fast

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