Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 427 · 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 of these is true of <header>? (a) sits at the very top (b) holds a news story (c) holds copyright notes (d) helps you move around
2. 2.🛡️ Online: is it safe to share your password? (a) not safe (b) safe
3. 3.Which colour pair is hard to read? (a) pink on red (b) white on dark blue (c) yellow on black (d) white on black
4. 4.🔠 Which heading shows the BIGGEST text: <h4>, <h5>, <h6> or <h3>? (a) <h4> (b) <h6> (c) <h3> (d) <h5>
5. 5.✍️ Which sign ends each CSS declaration? (a) , (b) ; (c) : (d) .
6. 6.📝 How many paragraphs does this code make?
   <p>My pets</p>
   <h2>Good morning!</h2>
   <p>Good morning!</p>
   <p>Cricket is fun.</p>
7. 7.✍️ What is the selector in this CSS rule?
   h1 {
     text-align: center;
     color: red;
     width: 300px;
     padding: 8px;
   } (a) p (b) red (c) h1 (d) text-align
8. 8.📝 What does <br> do? (a) makes text bold (b) starts a new line (c) makes a list (d) adds a picture
9. 9.📦 In the box model, which part is the text or picture? (a) padding (b) margin (c) content (d) border
10. 10.♿ A part of the page is under a <h5> heading. Which tag should its sub-heading use? (a) <h5> (b) <h2> (c) <h4> (d) <h6>
11. 11.⚖️ What colour is the text of this element?
    <p class="big" id="intro">Hi</p>
    CSS:
    #intro { color: black; }
    #intro { color: red; } (a) red (b) black (c) white (d) yellow
12. 12.🎯 What kind of selector is .note? (a) an id selector (b) an element selector (c) a class selector
13. 13.Which of these does JavaScript do? (a) changes the text size (b) rounds box corners (c) reacts to a button click (d) makes a form box
14. 14.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 320px;
      justify-content: center;
    }
    Inside are 4 boxes, each 50px wide (no margins).
15. 15.📝 On how many lines does the browser show this paragraph?
    <p>Birds sing<br>Rivers flow<br>Sky is blue<br>Kites fly high<br>Roses are red</p>
16. 16.🔡 Are HTML tag names usually written in small letters? (a) Yes (b) No
17. 17.⚡ What does this code print? (Look at the quotes!)
    let x = "5";
    let y = 1;
    console.log(x + y); (a) 6 (b) Error (c) 51
18. 18.🎯 Which sign starts an id selector? (a) . (b) & (c) @ (d) #
19. 19.📊 How many rows does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Banana</td><td>Jamun</td><td>Papaya</td></tr>
      <tr><td>Banana</td><td>Litchi</td><td>Mango</td></tr>
    </table>
20. 20.🔍 One closing tag is missing. Which one?
    <h2>My best friend</h2>
    <h3>Good morning!</h3>
    <u>The red kite (a) </u> (b) </h2> (c) </strong> (d) </h3>
21. 21.📝 Which input type picks a day? (a) checkbox (b) password (c) date (d) radio
22. 22.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 250px;
      padding: 10px;
      border: 1px solid black;
      margin: 10px;
    }
23. 23.🧩 An opening tag + content + a closing tag together make an ___. (a) address (b) editor (c) attribute (d) element
24. 24.📝 How many paragraphs does this code make?
    <p>My pets</p>
    <p>Cricket is fun.</p>
    <p>Hello, world!</p>
25. 25.True or false: a web server shows line numbers. (a) True (b) False
26. 26.⚖️ Two rules with the same selector set a colour. Which one wins? (a) neither (b) the later one (c) the shorter one (d) the first one
27. 27.📊 How many cells are in each row?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Guava</td><td>Jamun</td><td>Grapes</td></tr>
    </table>
28. 28.True or false: .big is an id selector. (a) True (b) False
29. 29.Which of these is true of a web server? (a) saves our .html files (b) turns HTML into a page (c) colours code to help us (d) hosts websites online
30. 30.🔠 How many headings are in this code?
    <h1>Rain today</h1>
    <p>Our school trip</p>
    <h3>My pets</h3>
    <p>Cricket is fun.</p>
31. 31.📄 Where does <img> go: in the head or in the body? (a) in the body (b) in the head
32. 32.🖼️ Which attribute of <img> sets how wide it is? (a) alt (b) src (c) height (d) width
33. 33.🌈 Which colour of light is strongest in rgb(244, 82, 138)? (a) red (b) green (c) blue
34. 34.True or false: <footer> sits at the bottom. (a) False (b) True
35. 35.🌍 What does a web address (URL) tell the browser? (a) the page colour (b) where the page is (c) your password (d) how old you are
36. 36.🌍 What do we call the computer that stores a website? (a) a keyboard (b) a server (c) a mouse (d) a printer
37. 37.💪 Which flexbox property turns on flexbox? (a) justify-content (b) flex-direction (c) display: flex (d) align-items
38. 38.🖌️ Which CSS property centres a heading? (a) font-size (b) font-weight (c) background-color (d) text-align
39. 39.🔁 How many times does this code print “Hi”?
    for (let i = 0; i < 9; i++) {
      console.log("Hi");
    }
40. 40.🎯 Which element does the selector .star style? (a) <p class="menu"> (b) <h1 class="note"> (c) <p id="star"> (d) <p class="star">

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