Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 255 · 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.✍️ What value is given to font-style in this rule?
   h1 {
     width: 300px;
     text-align: center;
     font-style: italic;
     font-weight: bold;
   } (a) font-style (b) red (c) italic (d) 20px
2. 2.📱 The screen is 414px wide. Does the rule inside @media apply?
   p {
     font-size: 20px;
   }
   @media (max-width: 480px) {
     p {
       font-size: 14px;
     }
   } (a) Yes (b) No
3. 3.🔗 Which address opens when you click this link?
   <a href="https://example.com">School news</a> (a) School news (b) https://example.com (c) art.html (d) maths.html
4. 4.🧭 Which semantic tag is the page’s key part? (a) <aside> (b) <main> (c) <footer> (d) <nav>
5. 5.📋 What number does the browser show next to “Banana”?
   <ol start="3">
     <li>Mango</li>
     <li>Banana</li>
     <li>Grapes</li>
   </ol>
6. 6.💬 How many paragraphs show on the page?
   <!-- <p>My best friend</p> -->
   <!-- <p>Cricket is fun.</p> -->
   <p>My pets</p>
7. 7.🌈 Hex digits go 0 to 9, then A to which letter? (a) Z (b) J (c) G (d) F
8. 8.🔁 How many times does this code print “Welcome”?
   for (let i = 1; i < 3; i++) {
     console.log("Welcome");
   }
9. 9.📝 Does <b> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
10. 10.💬 How does an HTML comment end? (a) */ (b) >> (c) // (d) -->
11. 11.📄 What is the big heading shown on this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Class 7 Blog</title>
    </head>
    <body>
      <h1>Planets</h1>
      <p>I like to read.</p>
    </body>
    </html> (a) Planets (b) body (c) I like to read. (d) Class 7 Blog
12. 12.True or false: to click prize links is not safe. (a) True (b) False
13. 13.⚖️ What colour is the text of this element?
    <h1 class="star" id="top">Hi</h1>
    CSS:
    #top { color: yellow; }
    #top { color: red; } (a) white (b) yellow (c) blue (d) red
14. 14.⚡ What does this code print? (Look at the quotes!)
    let x = "9";
    let y = 9;
    console.log(x + y); (a) 99 (b) Error (c) 18
15. 15.💬 Which text will NOT show on the page?
    <p>Rain today</p>
    <!-- <p>I love mangoes.</p> -->
    <p>Our school trip</p> (a) Our school trip (b) Rain today (c) I love mangoes.
16. 16.🧭 Which semantic tag holds the logo and title? (a) <footer> (b) <article> (c) <nav> (d) <header>
17. 17.🎯 Which CSS selector matches this element?
    <h2 class="star" id="intro">Hello</h2> (a) .star (b) #star (c) .intro (d) .menu
18. 18.🚀 Which file should this code go in: #top { color: blue; } (a) index.html (b) style.css (c) script.js
19. 19.🎯 Which element does the selector .star style? (a) <h2 class="menu"> (b) <li class="note"> (c) <h2 class="star"> (d) <h2 id="star">
20. 20.📝 On how many lines does the browser show this paragraph?
    <p>Kites fly high<br>Roses are red<br>Rivers flow<br>Sky is blue<br>Stars shine</p>
21. 21.True or false: alert(score); goes in index.html. (a) False (b) True
22. 22.🌍 Which one scrambles data on its way? (a) the server (b) the browser (c) HTTPS (d) the URL
23. 23.🔗 Which words do you click on?
    <a href="quiz.html">Visit the site</a> (a) href (b) Maths fun (c) quiz.html (d) Visit the site
24. 24.🔐 Is abcd1234 a strong or a weak password? (a) strong (b) weak
25. 25.🖌️ How big is the text, in px?
    h1 {
      text-align: left;
      color: yellow;
      font-size: 28px;
      background-color: purple;
    }
26. 26.💬 How does an HTML comment start? (a) // (b) # (c) <!-- (d) /*
27. 27.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h3> → <h5> (a) Yes (b) No
28. 28.✍️ How many declarations (property: value pairs) are in this rule?
    p {
      color: red;
      padding: 8px;
      text-align: center;
      font-weight: bold;
    }
29. 29.Which of these is true of <footer>? (a) sits at the very top (b) holds copyright notes (c) holds a side box of tips (d) holds the menu of links
30. 30.📊 In a table, which tag is a row? (a) <th> (b) <tr> (c) <td> (d) <tb>
31. 31.📋 Which list tag lists things in any order? (a) <li> (b) <ul> (c) <ol>
32. 32.🎯 What kind of selector is body? (a) a class selector (b) an id selector (c) an element selector
33. 33.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 3; i++) {
      total = total + 7;
    }
    console.log(total);
34. 34.True or false: <img src="cat.png"> goes in script.js. (a) True (b) False
35. 35.📝 How many paragraphs does this code make?
    <p>Cricket is fun.</p>
    <p>My pets</p>
    <h2>My pets</h2>
    <p>Hello, world!</p>
    <p>My pets</p>
    <p>My best friend</p>
36. 36.🚀 Which file should this code go in: console.log(5 + 2); (a) style.css (b) script.js (c) index.html
37. 37.🌍 What is the path in this URL?
    https://learn.example.com/maths/tables.html (a) /maths/tables.html (b) /index.html (c) learn.example.com (d) https
38. 38.📝 Which tag gives a form box a name you can click? (a) <h1> (b) <hr> (c) <title> (d) <label>
39. 39.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 290px;
      padding: 15px;
      border: 1px solid black;
      margin: 10px;
    }
40. 40.Which of these goes in the head? (a) <a> (b) <h1> (c) <ul> (d) <title>

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