Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 522 · 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 address opens when you click this link?
   <a href="about.html">School news</a> (a) about.html (b) contact.html (c) School news (d) https://example.com
2. 2.♿ Who uses a screen reader? (a) only teachers (b) only robots (c) only coders (d) people who are blind
3. 3.True or false: the browser asks for a web page. (a) False (b) True
4. 4.🎯 Which sign starts a class selector? (a) # (b) & (c) . (d) @
5. 5.🔍 Which is the odd one out? (a) reacts to a button click (b) makes headings and lists (c) shows a pop-up message (d) checks a quiz answer
6. 6.🔗 Which attribute holds the address of a link? (a) alt (b) id (c) src (d) href
7. 7.Which of these is padding? (a) space inside the border (b) a solid or dotted edge (c) the gap to other boxes (d) the text or picture
8. 8.⚡ What does this code show?
   let name = "Riya";
   alert("Hello, " + name + "!"); (a) name (b) Hello, name! (c) Riya (d) Hello, Riya!
9. 9.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 90px;
     padding: 30px;
     border: 2px solid black;
     margin: 10px;
   }
10. 10.✍️ How does a CSS comment start? (a) /* (b) // (c) <!-- (d) #
11. 11.True or false: <meta> is an empty tag. (a) True (b) False
12. 12.Which of these is a closing tag? (a) <p> (b) <body> (c) <h1> (d) </b>
13. 13.✍️ What is the selector in this CSS rule?
    p {
      border: 2px solid;
      margin: 10px;
    } (a) 10px (b) p (c) border (d) .note
14. 14.📱 max-width: 600px applies when the screen is ___. (a) turned off (b) 600px or wider (c) exactly 1000px (d) 600px or narrower
15. 15.📄 Where does <h1> go: in the head or in the body? (a) in the body (b) in the head
16. 16.🔍 Which is the odd one out? (a) is where we type code (b) saves our .html files (c) colours code to help us (d) stores a website’s files
17. 17.✍️ What is the selector in this CSS rule?
    .note {
      padding: 8px;
      color: red;
      font-size: 20px;
      text-align: center;
    } (a) red (b) #top (c) .note (d) padding
18. 18.📊 How many rows does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Guava</td><td>Guava</td><td>Jamun</td></tr>
    </table>
19. 19.💬 Why do coders write comments? (a) to make links (b) to show pictures (c) to leave notes (d) to add colour
20. 20.♿ A part of the page is under a <h4> heading. Which tag should its sub-heading use? (a) <h5> (b) <h2> (c) <h3> (d) <h6>
21. 21.True or false: <ol> is an unordered list. (a) True (b) False
22. 22.⚖️ What colour is the text of this element?
    <h1 class="menu" id="top">Hi</h1>
    CSS:
    h1 { color: blue; }
    h1 { color: purple; } (a) red (b) yellow (c) purple (d) blue
23. 23.🖼️ How many pixels wide is the picture drawn?
    <img src="bus.jpg" alt="Our school bus" width="400">
24. 24.🌈 Hex digits go 0 to 9, then A to which letter? (a) J (b) Z (c) G (d) F
25. 25.True or false: <li> lists things in any order. (a) False (b) True
26. 26.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 420px;
      justify-content: space-between;
    }
    Inside are 3 boxes, each 100px wide (no margins).
27. 27.True or false: the content is space outside the border. (a) True (b) False
28. 28.🎯 Which CSS selector matches this element?
    <h1 class="red" id="logo">Hello</h1> (a) #red (b) #logo (c) .box (d) .logo
29. 29.⚡ What does this code print? (Look at the quotes!)
    let x = "3";
    let y = 4;
    console.log(x + y); (a) 34 (b) Error (c) 7
30. 30.True or false: <li> lists steps in order. (a) False (b) True
31. 31.🧭 Which semantic tag sits at the very top? (a) <aside> (b) <footer> (c) <header> (d) <article>
32. 32.True or false: <ul> lists steps in order. (a) True (b) False
33. 33.⚖️ What colour is the text of this element?
    <h2 class="note" id="main">Hi</h2>
    CSS:
    #main { color: purple; }
    #main { color: red; } (a) purple (b) blue (c) white (d) red
34. 34.True or false: <style> goes in the head. (a) False (b) True
35. 35.📊 Are <th> cells shown bold and centred by default? (a) Yes (b) No
36. 36.🏷️ HTML marks up text using ___. (a) keys (b) pixels (c) wires (d) tags
37. 37.Which of these is a weak password? (a) S0lar!Pen#8 (b) Kite_Fl1es@Dawn (c) riya2014 (d) Blue@Tiger_74
38. 38.🔗 Which address opens when you click this link?
    <a href="quiz.html">Art corner</a> (a) quiz.html (b) Art corner (c) games.html (d) about.html
39. 39.🎯 How many elements on a page should have the same id? (a) 1 (b) 5 (c) 2 (d) any number
40. 40.⚖️ What colour is the text of this element?
    <h2 class="menu" id="hero">Hi</h2>
    CSS:
    .menu { color: black; }
    .menu { color: white; } (a) purple (b) yellow (c) white (d) black

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