Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 314 · 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 semantic tag holds copyright notes? (a) <article> (b) <header> (c) <aside> (d) <footer>
2. 2.📄 Where does <style> go: in the head or in the body? (a) in the body (b) in the head
3. 3.What does font-weight do? (a) picks the font style (b) makes the text bold (c) colours behind the text (d) centres a heading
4. 4.🔠 How many headings are in this code?
   <h1>The red kite</h1>
   <p>I love mangoes.</p>
   <h4>I love mangoes.</h4>
5. 5.True or false: <img src="cat.png"> goes in style.css. (a) False (b) True
6. 6.True or false: a web browser colours code to help us. (a) True (b) False
7. 7.💪 Which flexbox property sets space between boxes? (a) flex-direction (b) display: flex (c) justify-content (d) gap
8. 8.🌈 In #rrggbb, which colour do the first two digits give? (a) black (b) blue (c) red (d) green
9. 9.🚀 Where in index.html does the link to style.css go? (a) in the footer (b) in the head (c) after </html> (d) inside a <p>
10. 10.⚡ What does this code print? (Look at the quotes!)
    let x = "1";
    let y = 4;
    console.log(x + y); (a) 5 (b) 14 (c) Error
11. 11.🔗 What does target="_blank" do to a link? (a) opens it in a new tab (b) makes it bold (c) hides the link (d) makes it blank
12. 12.Which of these is margin? (a) the line round the box (b) space inside the border (c) space outside the border (d) the text or picture
13. 13.🖌️ How big is the text, in px?
    li {
      font-size: 40px;
      color: white;
      text-align: center;
      background-color: blue;
    }
14. 14.📋 How many items does this list show?
    <ul>
      <li>Grapes</li>
      <li>Mango</li>
    </ul>
15. 15.✍️ What is the selector in this CSS rule?
    .note {
      font-size: 20px;
      padding: 8px;
      margin: 10px;
    } (a) 8px (b) font-size (c) #top (d) .note
16. 16.✍️ What is the selector in this CSS rule?
    body {
      color: red;
      font-weight: bold;
      font-style: italic;
      text-align: center;
    } (a) body (b) bold (c) color (d) .box
17. 17.🔁 Which loop repeats code a set number of times? (a) else (b) if (c) for (d) let
18. 18.📝 Which input type hides what you type? (a) radio (b) password (c) submit (d) number
19. 19.🔢 When you open a web page, which comes LAST? (a) the browser asks it (b) you type the URL (c) DNS finds the server (d) the browser shows it
20. 20.🌍 What is the domain name in this URL?
    https://www.example.net/about.html (a) www.example.net (b) learn.example.com (c) https (d) /about.html
21. 21.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 170px;
      justify-content: space-between;
    }
    Inside are 2 boxes, each 80px wide (no margins).
22. 22.🔗 Which tag makes a clickable link? (a) <p> (b) <link> (c) <a> (d) <img>
23. 23.🎯 Which sign starts an id selector? (a) @ (b) & (c) . (d) #
24. 24.Which of these is true of <header>? (a) sits at the bottom (b) holds the logo and title (c) holds copyright notes (d) holds the menu of links
25. 25.🔢 When you open a web page, what comes right after “you type the URL”? (a) DNS finds the server (b) the browser shows it (c) the server sends files (d) the browser asks it
26. 26.🖌️ Which CSS property makes letters bigger? (a) font-weight (b) text-align (c) font-family (d) font-size
27. 27.🔗 Which attribute holds the address of a link? (a) href (b) src (c) id (d) alt
28. 28.✍️ How many declarations (property: value pairs) are in this rule?
    body {
      font-style: italic;
      border: 2px solid;
      font-weight: bold;
    }
29. 29.🚀 Which file should this code go in: <ul><li>Art</li></ul> (a) style.css (b) index.html (c) script.js
30. 30.🔗 Where does this link open?
    <a href="https://example.com" target="_blank">About us</a> (a) in the same tab (b) in a new tab
31. 31.🔍 Which is the odd one out? (a) adds space around boxes (b) sets colours and fonts (c) makes a link (d) rounds box corners
32. 32.📊 Which tag makes one data cell? (a) <td> (b) <caption> (c) <table> (d) <th>
33. 33.🔠 Which heading shows the SMALLEST text: <h1>, <h2>, <h3> or <h4>? (a) <h1> (b) <h4> (c) <h2> (d) <h3>
34. 34.True or false: <caption> gives the table a title. (a) False (b) True
35. 35.True or false: “skipping heading levels” makes the page harder to use. (a) False (b) True
36. 36.📝 What does a password box show instead of letters? (a) capital letters (b) numbers (c) dots (d) emojis
37. 37.🌈 In #rrggbb, which colour do the last two digits give? (a) red (b) white (c) blue (d) green
38. 38.Which of these is true of <aside>? (a) holds extra side notes (b) holds one blog post (c) holds copyright notes (d) holds a news story
39. 39.Which of these does JavaScript do? (a) sets colours and fonts (b) shows a pop-up message (c) adds space around boxes (d) puts a picture on a page
40. 40.🚀 Which file is best for code that reacts to clicks? (a) index.html (b) script.js (c) style.css (d) notes.txt

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