Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 550 · 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 a web browser? (a) hosts websites online (b) is where we type code (c) answers page requests (d) opens web pages for us
2. 2.✍️ Which property is set to 2px solid in this rule?
   .box {
     border: 2px solid;
     text-align: center;
     font-style: italic;
   } (a) 2px solid (b) width (c) border (d) font-style
3. 3.🔁 How many times does this code print “Hi”?
   for (let i = 0; i < 6; i++) {
     console.log("Hi");
   }
4. 4.🏷️ Is <p> an opening tag or a closing tag? (a) a closing tag (b) an opening tag
5. 5.🔠 Are headings shown in bold by default? (a) No (b) Yes
6. 6.📄 What is the big heading shown on this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>Class 7 Blog</title>
   </head>
   <body>
     <h1>Welcome!</h1>
     <p>Try this poha.</p>
   </body>
   </html> (a) body (b) Welcome! (c) Class 7 Blog (d) Try this poha.
7. 7.📊 Which tag holds the whole table? (a) <caption> (b) <tr> (c) <th> (d) <table>
8. 8.🔗 Where does this link open?
   <a href="maths.html" target="_blank">About us</a> (a) in the same tab (b) in a new tab
9. 9.📝 What does <p> make? (a) a table (b) a picture (c) a paragraph (d) a link
10. 10.📋 Which list shows the steps of a recipe best? (a) <ol> (b) <hr> (c) <br> (d) <ul>
11. 11.🔠 Which heading shows the SMALLEST text: <h6>, <h5>, <h2> or <h1>? (a) <h1> (b) <h5> (c) <h6> (d) <h2>
12. 12.📄 Where does <meta charset="utf-8"> go: in the head or in the body? (a) in the body (b) in the head
13. 13.🚀 Which file is best for the colours and fonts? (a) index.html (b) photo.jpg (c) style.css (d) script.js
14. 14.True or false: <tr> makes one data cell. (a) False (b) True
15. 15.🌍 What is the protocol in this URL?
    https://kids.example.org/games/chess.html (a) kids.example.org (b) http (c) https (d) /games/chess.html
16. 16.💬 How many paragraphs show on the page?
    <p>My pets</p>
    <p>I love mangoes.</p>
    <!-- <p>Cricket is fun.</p> -->
17. 17.Which of these does CSS do? (a) counts down a timer (b) puts a picture on a page (c) checks a quiz answer (d) lays out the page
18. 18.🔁 How many times does this code print “Hello”?
    for (let i = 0; i < 8; i++) {
      console.log("Hello");
    }
19. 19.⚡ Which JavaScript word writes in the console? (a) console.log() (b) if (c) alert() (d) for
20. 20.📊 How many rows does this table have?
    <table>
      <tr><td>Banana</td><td>Mango</td><td>Grapes</td><td>Mango</td></tr>
      <tr><td>Grapes</td><td>Mango</td><td>Litchi</td><td>Banana</td></tr>
    </table>
21. 21.📝 How many paragraphs does this code make?
    <p>The red kite</p>
    <h2>Our school trip</h2>
    <h2>Fun facts</h2>
    <p>My pets</p>
    <p>Our school trip</p>
22. 22.True or false: in <img>, width shows if the image fails. (a) True (b) False
23. 23.✍️ In color: blue; which part is the property? (a) blue (b) : (c) color (d) ;
24. 24.True or false: <aside> helps you move around. (a) True (b) False
25. 25.What is <input type="number"> for? (a) lets you tick many (b) sends the form (c) takes only numbers (d) hides what you type
26. 26.🌍 What is the protocol in this URL?
    http://school.example.in/about.html (a) school.example.in (b) /about.html (c) https (d) http
27. 27.True or false: li is an element selector. (a) False (b) True
28. 28.📄 Where does the text of <title> appear? (a) nowhere (b) at the bottom (c) in a big heading (d) on the browser tab
29. 29.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 100px;
      padding: 25px;
      border: 1px solid black;
      margin: 0px;
    }
30. 30.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="fort.jpg" alt="An old fort" width="350"> (a) fort.jpg (b) width (c) A tiger asleep (d) An old fort
31. 31.📱 Responsive design means a page ___. (a) has no pictures (b) is only for laptops (c) never changes (d) fits every screen
32. 32.🧩 Which language adds space around boxes? (a) CSS (b) JavaScript (c) HTML
33. 33.⚡ Which JavaScript word repeats code? (a) alert() (b) let (c) for (d) console.log()
34. 34.True or false: #hero is an id selector. (a) True (b) False
35. 35.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 230px;
      justify-content: center;
    }
    Inside are 3 boxes, each 50px wide (no margins).
36. 36.✍️ How many declarations (property: value pairs) are in this rule?
    h2 {
      font-style: italic;
      font-weight: bold;
    }
37. 37.⚖️ What colour is the text of this element?
    <h2 class="note" id="end">Hi</h2>
    CSS:
    h2 { color: white; }
    h2 { color: blue; } (a) purple (b) orange (c) blue (d) white
38. 38.True or false: “tiny grey text” makes the page harder to use. (a) True (b) False
39. 39.Which of these is safe to do online? (a) share your OTP (b) meet an online stranger (c) use a strong password (d) type a password on http
40. 40.Which of these is the border? (a) the text or picture (b) a solid or dotted edge (c) the gap to other boxes (d) the gap round content

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