Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 88 · 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.True or false: <main> is the page’s key part. (a) False (b) True
2. 2.📋 How many items does this list show?
   <ul>
     <li>Mango</li>
     <li>Jamun</li>
     <li>Guava</li>
     <li>Papaya</li>
     <li>Grapes</li>
   </ul>
3. 3.📄 Where does the text of <title> appear? (a) nowhere (b) on the browser tab (c) at the bottom (d) in a big heading
4. 4.📝 At most, how many of these can be chosen at the same time?
   <form>
     <input type="radio" name="colour"> Red
     <input type="radio" name="colour"> Blue
     <input type="radio" name="colour"> Green
     <input type="radio" name="colour"> Pink
     <input type="radio" name="colour"> Orange
   </form>
5. 5.🎯 Which element does the selector .box style? (a) <p class="menu"> (b) <span class="box"> (c) <span class="star"> (d) <span id="box">
6. 6.📝 How many paragraphs does this code make?
   <p>I love mangoes.</p>
   <p>Our school trip</p>
   <h2>I love mangoes.</h2>
7. 7.⚡ Which JavaScript word writes in the console? (a) alert() (b) if (c) for (d) console.log()
8. 8.🔢 On a typical page, from top to bottom, what comes right after “<nav>”? (a) <header> (b) <footer> (c) <main>
9. 9.🏷️ Every HTML tag starts with which sign? (a) [ (b) ( (c) { (d) <
10. 10.✍️ In color: blue; which part is the property? (a) blue (b) : (c) ; (d) color
11. 11.🎯 What kind of selector is .note? (a) an element selector (b) a class selector (c) an id selector
12. 12.⚡ Which word makes a new variable? (a) let (b) make (c) put (d) give
13. 13.📱 min-width: 800px applies when the screen is ___. (a) 800px or wider (b) 800px or narrower (c) exactly 100px (d) turned off
14. 14.📋 Which list tag lists steps in order? (a) <li> (b) <ol> (c) <ul>
15. 15.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h2> → <h2> (a) No (b) Yes
16. 16.📋 Does this list show bullets or numbers?
    <ol>
      <li>Mango</li>
      <li>Jamun</li>
    </ol> (a) numbers (b) bullets
17. 17.🌍 What is the path in this URL?
    https://learn.example.com/games/chess.html (a) learn.example.com (b) https (c) /games/chess.html (d) /about.html
18. 18.🌈 Which colour is #ffffff? (a) white (b) black (c) bright green (d) red
19. 19.💬 How does an HTML comment end? (a) */ (b) --> (c) // (d) >>
20. 20.⚡ Which tag holds JavaScript in a page? (a) <style> (b) <script> (c) <js> (d) <code>
21. 21.⚖️ What colour is the text of this element?
    <p class="note" id="hero">Hi</p>
    CSS:
    #hero { color: orange; }
    p { color: red; }
    .note { color: black; } (a) red (b) purple (c) orange (d) black
22. 22.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Orange</td><td>Papaya</td><td>Jamun</td></tr>
    </table>
23. 23.⚖️ What colour is the text of this element?
    <h1 class="box" id="hero">Hi</h1>
    CSS:
    #hero { color: purple; }
    #hero { color: green; } (a) orange (b) purple (c) white (d) green
24. 24.🔠 Which heading shows the SMALLEST text: <h6>, <h3>, <h2> or <h5>? (a) <h2> (b) <h5> (c) <h3> (d) <h6>
25. 25.💬 How does an HTML comment start? (a) # (b) /* (c) // (d) <!--
26. 26.True or false: <ul> shows 1, 2, 3 numbers. (a) True (b) False
27. 27.🏷️ Is <b> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
28. 28.🔍 Which is the odd one out? (a) colours code to help us (b) saves our .html files (c) hosts websites online (d) is where we type code
29. 29.⚡ What does alert() show? (a) a table (b) a new tab (c) a picture (d) a pop-up box
30. 30.📊 Which tag makes a heading cell? (a) <caption> (b) <tr> (c) <th> (d) <table>
31. 31.🌈 Which colour of light is strongest in rgb(78, 150, 45)? (a) red (b) green (c) blue
32. 32.🌐 Which one saves our .html files? (a) a web browser (b) a code editor (c) a web server
33. 33.🖌️ What colour are the letters?
    h1 {
      text-align: left;
      background-color: blue;
      font-size: 36px;
      color: yellow;
    } (a) yellow (b) white (c) blue
34. 34.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 170px;
      justify-content: space-between;
    }
    Inside are 2 boxes, each 50px wide (no margins).
35. 35.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 180px;
      justify-content: flex-start;
    }
    Inside are 3 boxes, each 40px wide (no margins).
36. 36.📝 What does <hr> draw? (a) a line across the page (b) a table (c) a picture (d) a link
37. 37.🔍 Which is the odd one out? (a) sends pages over the net (b) answers page requests (c) turns HTML into a page (d) hosts websites online
38. 38.🖌️ Which CSS property sets the letter colour? (a) background-color (b) font-size (c) font-family (d) color
39. 39.📝 Does <h1> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
40. 40.✍️ How many declarations (property: value pairs) are in this rule?
    #top {
      border: 2px solid;
    }

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