Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 59 · 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 picture file does the browser load?
   <img src="moon.png" alt="The full moon" width="250"> (a) The full moon (b) fort.jpg (c) moon.png (d) bus.jpg
2. 2.🚀 Which program lets you see your web page while you build it? (a) a photo viewer (b) a web browser (c) a calculator (d) a music player
3. 3.🌐 Which one opens web pages for us? (a) a web server (b) a web browser (c) a code editor
4. 4.True or false: .note is an element selector. (a) False (b) True
5. 5.🔠 Which heading shows the BIGGEST text: <h1>, <h6>, <h3> or <h5>? (a) <h6> (b) <h1> (c) <h3> (d) <h5>
6. 6.📊 Where do <td> cells go? (a) inside a <li> (b) inside the <head> (c) inside a <tr> (d) inside a <p>
7. 7.🔗 Which address opens when you click this link?
   <a href="art.html">Contact us</a> (a) quiz.html (b) news.html (c) Contact us (d) art.html
8. 8.⚡ What does this code print? (Look at the quotes!)
   let x = "9";
   let y = 1;
   console.log(x + y); (a) Error (b) 10 (c) 91
9. 9.♿ Who uses a screen reader? (a) only teachers (b) only coders (c) people who are blind (d) only robots
10. 10.🔗 Which address opens when you click this link?
    <a href="quiz.html">School news</a> (a) about.html (b) games.html (c) School news (d) quiz.html
11. 11.🧭 Is <header> semantic or not semantic? (a) not semantic (b) semantic
12. 12.True or false: <input type="email"> is for an email address. (a) False (b) True
13. 13.♿ Which link text is clearest? (a) Read the fruit facts (b) click here (c) link (d) here
14. 14.True or false: CSS makes headings and lists. (a) True (b) False
15. 15.🎯 What kind of selector is #top? (a) an element selector (b) an id selector (c) a class selector
16. 16.🖌️ How big is the text, in px?
    p {
      font-size: 16px;
      background-color: red;
      text-align: right;
      color: blue;
    }
17. 17.🏷️ Is </h1> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
18. 18.🏷️ Is <li> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
19. 19.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 220px;
      padding: 30px;
      border: 1px solid black;
      margin: 5px;
    }
20. 20.🖌️ What colour are the letters?
    p {
      text-align: left;
      color: yellow;
      background-color: blue;
      font-size: 40px;
    } (a) yellow (b) blue (c) purple
21. 21.What does font-weight do? (a) sets the letter colour (b) colours behind the text (c) makes letters bigger (d) makes the text bold
22. 22.🖼️ Which attribute of <img> sets how tall it is? (a) width (b) alt (c) src (d) height
23. 23.🌈 How many pairs of hex digits are in a colour like #ff8800? (a) 3 (b) 4 (c) 2 (d) 6
24. 24.True or false: CSS sets colours and fonts. (a) False (b) True
25. 25.📊 In a table, which tag is a row? (a) <tb> (b) <td> (c) <th> (d) <tr>
26. 26.🔗 Which words do you click on?
    <a href="contact.html">About us</a> (a) href (b) About us (c) contact.html (d) Contact us
27. 27.Which of these goes in the body? (a) <style> (b) <table> (c) <title> (d) <link rel="stylesheet">
28. 28.♿ A part of the page is under a <h4> heading. Which tag should its sub-heading use? (a) <h5> (b) <h4> (c) <h6> (d) <h1>
29. 29.📊 Which tag makes one table row? (a) <caption> (b) <tr> (c) <td> (d) <table>
30. 30.🖌️ What colour is behind the letters?
    h1 {
      background-color: black;
      font-size: 24px;
      text-align: center;
      color: purple;
    } (a) green (b) black (c) purple
31. 31.True or false: <h1>My Site</h1> goes in script.js. (a) False (b) True
32. 32.✍️ What value is given to color in this rule?
    #top {
      padding: 8px;
      text-align: center;
      color: red;
      border: 2px solid;
    } (a) center (b) color (c) 20px (d) red
33. 33.Which of these is margin? (a) space outside the border (b) the text or picture (c) the gap round content (d) the line round the box
34. 34.🔗 Which words do you click on?
    <a href="contact.html">School news</a> (a) contact.html (b) Take the quiz (c) School news (d) href
35. 35.🔍 Which is the odd one out? (a) adds space around boxes (b) makes headings and lists (c) lays out the page (d) changes the text size
36. 36.🔗 Which words do you click on?
    <a href="news.html">Play games</a> (a) news.html (b) href (c) About us (d) Play games
37. 37.True or false: a web server stores a website’s files. (a) False (b) True
38. 38.Which of these is the content? (a) the text or picture (b) the gap round content (c) space outside the border (d) a solid or dotted edge
39. 39.🔁 What does this code print?
    let temp = 42;
    if (temp >= 5) {
      console.log("Hot");
    } else {
      console.log("Cool");
    } (a) Cool (b) Hot
40. 40.🛡️ Online: is it safe to meet an online stranger? (a) safe (b) not safe

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