Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 335 · 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 many paragraphs does this code make?
   <p>My best friend</p>
   <h2>My pets</h2>
   <p>My best friend</p>
   <p>I love mangoes.</p>
   <p>Cricket is fun.</p>
2. 2.True or false: #end is an id selector. (a) True (b) False
3. 3.📄 What is the first line of an HTML5 page? (a) <body> (b) <!DOCTYPE html> (c) <head> (d) <html>
4. 4.🖌️ What colour are the letters?
   h1 {
     color: orange;
     background-color: blue;
     text-align: left;
     font-size: 16px;
   } (a) green (b) blue (c) orange
5. 5.📝 What does a password box show instead of letters? (a) capital letters (b) emojis (c) numbers (d) dots
6. 6.True or false: <input type="checkbox"> lets you tick many. (a) False (b) True
7. 7.📄 Can HTML on its own add pictures to a page? (a) Yes (b) No
8. 8.True or false: the browser is the page’s address. (a) False (b) True
9. 9.🖼️ How many pixels wide is the picture drawn?
   <img src="tiger.jpg" alt="A tiger asleep" width="50">
10. 10.✍️ How many declarations (property: value pairs) are in this rule?
    h2 {
      margin: 10px;
    }
11. 11.🔁 What does this code print?
    let score = 45;
    if (score > 24) {
      console.log("You win");
    } else {
      console.log("Play again");
    } (a) Play again (b) You win
12. 12.🧭 Which semantic tag is the page’s key part? (a) <footer> (b) <header> (c) <main> (d) <article>
13. 13.✍️ In color: blue; which part is the property? (a) ; (b) : (c) blue (d) color
14. 14.Which colour pair is easy to read? (a) light grey on white (b) blue on purple (c) red on green (d) dark grey on white
15. 15.🔠 How many headings are in this code?
    <h1>Cricket is fun.</h1>
    <p>Hello, world!</p>
    <p>Rain today</p>
    <p>My best friend</p>
16. 16.🖌️ Where does the text sit on its line?
    li {
      text-align: left;
      font-size: 28px;
      color: green;
      background-color: yellow;
    } (a) in the middle (b) on the right (c) on the left
17. 17.True or false: <table> holds the whole table. (a) True (b) False
18. 18.⚡ A JavaScript file usually ends with which extension? (a) .css (b) .html (c) .js (d) .jpg
19. 19.🔠 Which tag is used for the main title on a page? (a) <h6> (b) <br> (c) <p> (d) <h1>
20. 20.Which of these does CSS do? (a) checks a quiz answer (b) sets colours and fonts (c) gives the page structure (d) makes a form box
21. 21.🚀 Which file is best for the colours and fonts? (a) style.css (b) script.js (c) photo.jpg (d) index.html
22. 22.📝 Which tag gives a form box a name you can click? (a) <title> (b) <h1> (c) <label> (d) <hr>
23. 23.⚖️ What colour is the text of this element?
    <h1 class="star" id="top">Hi</h1>
    CSS:
    .star { color: white; }
    .star { color: blue; } (a) yellow (b) white (c) red (d) blue
24. 24.💪 Which justify-content value packs boxes at the start? (a) space-between (b) center (c) flex-end (d) flex-start
25. 25.📋 What number does the browser show next to “Orange”?
    <ol>
      <li>Mango</li>
      <li>Orange</li>
      <li>Jamun</li>
      <li>Banana</li>
      <li>Litchi</li>
      <li>Guava</li>
    </ol>
26. 26.Which of these is true of a web server? (a) is where we type code (b) saves our .html files (c) shows line numbers (d) answers page requests
27. 27.🔡 Are HTML tag names usually written in small letters? (a) Yes (b) No
28. 28.💪 Which justify-content value equal gaps, none at ends? (a) flex-start (b) center (c) flex-end (d) space-between
29. 29.🔠 Which heading shows the SMALLEST text: <h1>, <h6>, <h5> or <h2>? (a) <h1> (b) <h2> (c) <h5> (d) <h6>
30. 30.🏷️ Every HTML tag starts with which sign? (a) { (b) ( (c) [ (d) <
31. 31.What does justify-content: flex-end do? (a) puts boxes in the middle (b) packs boxes at the start (c) packs boxes at the end (d) equal gaps, none at ends
32. 32.True or false: <li> is one item of a list. (a) False (b) True
33. 33.🎯 Which element does the selector h1 style? (a) <h2> (b) <div id="hero"> (c) <li class="note"> (d) <h1 class="note">
34. 34.🎯 Which sign starts an id selector? (a) @ (b) # (c) . (d) &
35. 35.✍️ What is the selector in this CSS rule?
    .note {
      border: 2px solid;
      text-align: center;
      background-color: yellow;
    } (a) #top (b) .note (c) center (d) border
36. 36.🌈 In #rrggbb, which colour do the first two digits give? (a) green (b) blue (c) red (d) black
37. 37.📊 How many cells are in each row?
    <table>
      <tr><td>Papaya</td><td>Guava</td><td>Mango</td></tr>
      <tr><td>Guava</td><td>Mango</td><td>Mango</td></tr>
      <tr><td>Banana</td><td>Mango</td><td>Orange</td></tr>
    </table>
38. 38.🌐 Which one opens web pages for us? (a) a code editor (b) a web server (c) a web browser
39. 39.Which of these is a closing tag? (a) <body> (b) <li> (c) <h1> (d) </p>
40. 40.📊 Which tag makes one table row? (a) <caption> (b) <tr> (c) <td> (d) <table>

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