Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 573 · 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 list suits a shopping list in any order? (a) <br> (b) <hr> (c) <ol> (d) <ul>
2. 2.Which of these is true of a web server? (a) stores a website’s files (b) saves our .html files (c) shows pages from the web (d) opens web pages for us
3. 3.Which of these is not safe to do online? (a) tell a trusted adult (b) check for https first (c) think before you post (d) click prize links
4. 4.🎯 Which sign starts an id selector? (a) @ (b) . (c) # (d) &
5. 5.What is <input type="radio"> for? (a) hides what you type (b) lets you tick many (c) lets you pick only one (d) takes only numbers
6. 6.📄 What is the big heading shown on this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>My Hobbies</title>
   </head>
   <body>
     <h1>Match report</h1>
     <p>We won by 5 runs.</p>
   </body>
   </html> (a) My Hobbies (b) We won by 5 runs. (c) Match report (d) body
7. 7.📝 How many paragraphs does this code make?
   <p>Hello, world!</p>
   <h2>The red kite</h2>
   <p>Fun facts</p>
   <h2>My pets</h2>
   <h2>Good morning!</h2>
   <p>Rain today</p>
8. 8.Which of these has a closing tag? (a) <meta> (b) <p> (c) <br> (d) <hr>
9. 9.🚀 Which file should this code go in: h1 { font-size: 32px; } (a) index.html (b) script.js (c) style.css
10. 10.📝 What does <hr> draw? (a) a table (b) a link (c) a picture (d) a line across the page
11. 11.📝 How many paragraphs does this code make?
    <p>Good morning!</p>
    <p>Fun facts</p>
    <p>Our school trip</p>
    <h2>Cricket is fun.</h2>
    <h2>Rain today</h2>
12. 12.📋 How many items does this list show?
    <ul>
      <li>Mango</li>
      <li>Banana</li>
    </ul>
13. 13.📋 What number does the browser show next to “Jamun”?
    <ol>
      <li>Mango</li>
      <li>Jamun</li>
      <li>Papaya</li>
    </ol>
14. 14.⚡ What number does this code print?
    let a = 21;
    let b = 23;
    console.log(a + b);
15. 15.📱 Responsive design means a page ___. (a) fits every screen (b) is only for laptops (c) has no pictures (d) never changes
16. 16.🌐 Which one stores a website’s files? (a) a code editor (b) a web server (c) a web browser
17. 17.🚀 What is the home page file of a website usually called? (a) home.css (b) main.png (c) start.js (d) index.html
18. 18.True or false: “label every form box” helps everyone use the page. (a) True (b) False
19. 19.📱 The screen is 1366px wide. Does the rule inside @media apply?
    p {
      font-size: 16px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 12px;
      }
    } (a) No (b) Yes
20. 20.📋 How many items does this list show?
    <ol>
      <li>Mango</li>
      <li>Litchi</li>
      <li>Guava</li>
      <li>Banana</li>
      <li>Grapes</li>
      <li>Orange</li>
    </ol>
21. 21.📊 How many cells are in each row?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Papaya</td><td>Jamun</td><td>Banana</td><td>Mango</td></tr>
    </table>
22. 22.Which of these is true of <nav>? (a) sits at the bottom (b) holds the main content (c) holds the logo and title (d) holds the menu of links
23. 23.🚀 Which file is best for code that reacts to clicks? (a) notes.txt (b) index.html (c) script.js (d) style.css
24. 24.🔠 Which heading shows the BIGGEST text: <h5>, <h2>, <h6> or <h1>? (a) <h5> (b) <h1> (c) <h6> (d) <h2>
25. 25.📦 How wide (px) is this box from the outer edge of its left border to the outer edge of its right border?
    .box {
      width: 80px;
      padding: 30px;
      border: 3px solid black;
      margin: 0px;
    }
26. 26.🔗 Which tag makes a clickable link? (a) <link> (b) <img> (c) <p> (d) <a>
27. 27.🎯 What kind of selector is .card? (a) an element selector (b) an id selector (c) a class selector
28. 28.🖼️ Which tag puts a picture on a page? (a) <p> (b) <a> (c) <pic> (d) <img>
29. 29.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is a game (b) the data is scrambled (c) the site is free (d) the site is fast
30. 30.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 7; i++) {
      total = total + i;
    }
    console.log(total);
31. 31.🌈 In #0000a6 the blue part is the hex number a6. What is it as a normal number?
32. 32.⚡ What number does this code print?
    let a = 10;
    let b = 2;
    console.log(a * b);
33. 33.📝 How many paragraphs does this code make?
    <p>Rain today</p>
    <h2>The red kite</h2>
    <p>Rain today</p>
    <h2>Cricket is fun.</h2>
    <h2>Cricket is fun.</h2>
34. 34.🌐 Which one is where we type code? (a) a web server (b) a web browser (c) a code editor
35. 35.📝 How many <input> tags are in this form?
    <form>
      <input type="password">
      <input type="number">
      <input type="text">
      <input type="submit" value="Send">
    </form>
36. 36.What does justify-content: space-between do? (a) packs boxes at the start (b) puts boxes in the middle (c) packs boxes at the end (d) equal gaps, none at ends
37. 37.Which of these is an opening tag? (a) </title> (b) </p> (c) </li> (d) <h1>
38. 38.🎯 Which CSS selector matches this element?
    <li class="note" id="main">Hello</li> (a) div (b) .big (c) #note (d) #main
39. 39.🎯 Which CSS selector matches this element?
    <h1 class="red" id="hero">Hello</h1> (a) .red (b) .box (c) .hero (d) #red
40. 40.Which of these does HTML do? (a) changes the text size (b) counts down a timer (c) gives the page structure (d) sets colours and fonts

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