Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 965 · 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: <ol> shows bullet points. (a) True (b) False
2. 2.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 150px;
     padding: 20px;
     border: 1px solid black;
     margin: 20px;
   }
3. 3.📱 What does a media query check? (a) the screen width (b) the page title (c) the time of day (d) the battery level
4. 4.🔢 In a basic web page file, which comes LAST? (a) <head> (b) </html> (c) <!DOCTYPE html> (d) <html>
5. 5.📝 Which tag makes a drop-down list? (a) <li> (b) <select> (c) <ul> (d) <ol>
6. 6.🔠 Which heading shows the BIGGEST text: <h1>, <h4>, <h6> or <h2>? (a) <h6> (b) <h4> (c) <h2> (d) <h1>
7. 7.🌈 Which hex code is blue? (a) #00ff00 (b) #ffffff (c) #0000ff (d) #ffff00
8. 8.⚖️ What colour is the text of this element?
   <h1 class="red" id="logo">Hi</h1>
   CSS:
   .red { color: blue; }
   h1 { color: purple; }
   #logo { color: red; } (a) orange (b) blue (c) red (d) purple
9. 9.🌍 Which one stores the site’s files? (a) the server (b) HTTPS (c) the URL (d) the browser
10. 10.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 10px;
      }
    }
11. 11.🔁 What is the LAST number this code prints?
    for (let i = 0; i < 14; i = i + 3) {
      console.log(i);
    }
12. 12.True or false: in <img>, height sets how tall it is. (a) False (b) True
13. 13.📱 Responsive design means a page ___. (a) has no pictures (b) fits every screen (c) never changes (d) is only for laptops
14. 14.🎨 What does CSS stand for? (a) Computer Style Sheets (b) Creative Sheet System (c) Cascading Style Sheets (d) Colourful Site Styles
15. 15.📊 Which tag makes a heading cell? (a) <table> (b) <tr> (c) <th> (d) <td>
16. 16.💪 Which justify-content value packs boxes at the end? (a) center (b) flex-end (c) space-between (d) flex-start
17. 17.True or false: console.log(5 + 2); goes in style.css. (a) False (b) True
18. 18.🔢 On a typical page, from top to bottom, what comes right after “<nav>”? (a) <header> (b) <footer> (c) <main>
19. 19.🚀 Where in index.html does the link to style.css go? (a) in the head (b) after </html> (c) inside a <p> (d) in the footer
20. 20.Which of these is not safe to do online? (a) use a strong password (b) use a nickname in games (c) check for https first (d) share your password
21. 21.🔠 Which heading shows the BIGGEST text: <h5>, <h1>, <h2> or <h3>? (a) <h1> (b) <h3> (c) <h2> (d) <h5>
22. 22.Which colour pair is easy to read? (a) yellow on white (b) pink on red (c) light grey on white (d) white on black
23. 23.🔡 Are HTML tag names usually written in small letters? (a) Yes (b) No
24. 24.✍️ Which sign ends each CSS declaration? (a) ; (b) , (c) . (d) :
25. 25.🔗 Which words do you click on?
    <a href="contact.html">School news</a> (a) Take the quiz (b) School news (c) href (d) contact.html
26. 26.🎯 Which element does the selector h1 style? (a) <h1 class="menu"> (b) <li class="menu"> (c) <div id="main"> (d) <h2>
27. 27.True or false: HTML on its own can add up two numbers. (a) False (b) True
28. 28.🔗 Which address opens when you click this link?
    <a href="games.html">Contact us</a> (a) Contact us (b) contact.html (c) games.html (d) about.html
29. 29.📄 Can HTML on its own make links to pages? (a) Yes (b) No
30. 30.🌍 What is the domain name in this URL?
    https://kids.example.org/about.html (a) /about.html (b) kids.example.org (c) https (d) school.example.in
31. 31.📋 Which list shows the steps of a recipe best? (a) <hr> (b) <ol> (c) <ul> (d) <br>
32. 32.📝 Does <h1> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
33. 33.♿ Does this help everyone, or make the page harder to use: add alt text to images? (a) makes it harder (b) helps everyone
34. 34.🔗 Which address opens when you click this link?
    <a href="games.html">Art corner</a> (a) about.html (b) contact.html (c) games.html (d) Art corner
35. 35.Which of these is an empty tag? (a) <input> (b) <b> (c) <ul> (d) <li>
36. 36.🏷️ Every HTML tag starts with which sign? (a) [ (b) ( (c) { (d) <
37. 37.True or false: “tiny grey text” makes the page harder to use. (a) False (b) True
38. 38.🔗 Which words do you click on?
    <a href="quiz.html">Take the quiz</a> (a) href (b) quiz.html (c) Take the quiz (d) Play games
39. 39.🌈 Which colour is #ff0000? (a) cyan (b) bright green (c) red (d) black
40. 40.🔠 How many headings are in this code?
    <h1>Fun facts</h1>
    <p>Cricket is fun.</p>
    <h2>My best friend</h2>

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