Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 670 · 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 much empty space (px) is before the first box?
   .row {
     display: flex;
     width: 260px;
     justify-content: center;
   }
   Inside are 2 boxes, each 100px wide (no margins).
2. 2.🖼️ Which attribute of <img> tells which image to load? (a) width (b) alt (c) height (d) src
3. 3.🎯 Which element does the selector .star style? (a) <div id="star"> (b) <span class="note"> (c) <div class="star"> (d) <div class="menu">
4. 4.Which of these is the content? (a) the text or picture (b) a solid or dotted edge (c) space outside the border (d) the line round the box
5. 5.📝 Does <b> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
6. 6.🖼️ The picture cannot load. Which text does the browser show instead?
   <img src="map.png" alt="Map of India" width="200"> (a) Map of India (b) width (c) Birthday cake (d) map.png
7. 7.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is free (b) the data is scrambled (c) the site is fast (d) the site is a game
8. 8.🌈 In #008e00 the green part is the hex number 8e. What is it as a normal number?
9. 9.Which of these is margin? (a) a solid or dotted edge (b) the gap round content (c) the gap to other boxes (d) the text or picture
10. 10.🖌️ Which CSS property centres a heading? (a) text-align (b) font-family (c) font-size (d) font-weight
11. 11.🔠 How many headings are in this code?
    <h1>Rain today</h1>
    <p>The red kite</p>
    <h2>Hello, world!</h2>
12. 12.🔍 Which is the odd one out? (a) adds space around boxes (b) puts a picture on a page (c) makes a form box (d) gives the page structure
13. 13.🖌️ What colour is behind the letters?
    h2 {
      color: white;
      text-align: right;
      background-color: blue;
      font-size: 16px;
    } (a) green (b) white (c) blue
14. 14.📝 Which input type lets you pick only one? (a) radio (b) email (c) password (d) text
15. 15.🚀 Which program lets you see your web page while you build it? (a) a photo viewer (b) a calculator (c) a web browser (d) a music player
16. 16.♿ What does good colour contrast mean? (a) text stands out clearly (b) only red text (c) no colours at all (d) many bright colours
17. 17.True or false: <title> goes in the body. (a) True (b) False
18. 18.🔁 What is the LAST number this code prints?
    for (let i = 0; i < 10; i = i + 2) {
      console.log(i);
    }
19. 19.True or false: body { margin: 0; } goes in script.js. (a) False (b) True
20. 20.⚡ Which JavaScript word writes in the console? (a) for (b) if (c) let (d) console.log()
21. 21.✍️ Which sign goes between a property and its value? (a) = (b) ; (c) - (d) :
22. 22.True or false: a code editor saves our .html files. (a) True (b) False
23. 23.🖌️ Which CSS property sets the letter colour? (a) color (b) background-color (c) font-size (d) text-align
24. 24.True or false: HTML makes a form box. (a) True (b) False
25. 25.✍️ What value is given to text-align in this rule?
    h2 {
      background-color: yellow;
      border: 2px solid;
      color: red;
      text-align: center;
    } (a) center (b) text-align (c) 10px (d) yellow
26. 26.True or false: <input type="email"> is for an email address. (a) False (b) True
27. 27.🎨 Which tag connects an outside CSS file? (a) <img> (b) <css> (c) <link> (d) <a>
28. 28.Which of these is an empty tag? (a) <ul> (b) <title> (c) <input> (d) <h1>
29. 29.🔐 Is S0lar!Pen#8 a strong or a weak password? (a) weak (b) strong
30. 30.True or false: p is an element selector. (a) True (b) False
31. 31.📋 Which list tag is an ordered list? (a) <ol> (b) <li> (c) <ul>
32. 32.♿ Does this help everyone, or make the page harder to use: link text “click here”? (a) makes it harder (b) helps everyone
33. 33.📝 On how many lines does the browser show this paragraph?
    <p>Sky is blue<br>Rivers flow<br>Kites fly high<br>Stars shine<br>Birds sing</p>
34. 34.🔗 Which words do you click on?
    <a href="contact.html">Art corner</a> (a) School news (b) contact.html (c) Art corner (d) href
35. 35.🔢 On a typical page, from top to bottom, what comes right after “<nav>”? (a) <main> (b) <header> (c) <footer>
36. 36.⚡ Which JavaScript word makes a new variable? (a) for (b) alert() (c) console.log() (d) let
37. 37.⚡ What number does this code print?
    let a = 38;
    let b = 39;
    console.log(a + b);
38. 38.True or false: <tr> gives the table a title. (a) False (b) True
39. 39.🔁 What does i++ do? (a) adds 1 to i (b) doubles i (c) prints i (d) takes 1 from i
40. 40.💪 Which justify-content value equal gaps, none at ends? (a) center (b) space-between (c) flex-start (d) flex-end

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