Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 711 · 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: <input> has a closing tag. (a) False (b) True
2. 2.📄 Can HTML on its own keep a high score? (a) No (b) Yes
3. 3.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 110px;
     padding: 15px;
     border: 3px solid black;
     margin: 20px;
   }
4. 4.🔠 Which heading shows the BIGGEST text: <h6>, <h2>, <h4> or <h5>? (a) <h4> (b) <h2> (c) <h5> (d) <h6>
5. 5.🎯 What kind of selector is .note? (a) an element selector (b) an id selector (c) a class selector
6. 6.🌈 In #rrggbb, which colour do the first two digits give? (a) blue (b) red (c) green (d) black
7. 7.🔠 How many headings are in this code?
   <h1>My pets</h1>
   <h3>Cricket is fun.</h3>
   <h4>My pets</h4>
   <h4>I love mangoes.</h4>
   <h2>Fun facts</h2>
8. 8.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 180px;
     padding: 25px;
     border: 5px solid black;
     margin: 0px;
   }
9. 9.Which of these goes in the head? (a) <table> (b) <link rel="stylesheet"> (c) <ul> (d) <p>
10. 10.Which of these is true of <footer>? (a) holds extra side notes (b) is the page’s key part (c) holds copyright notes (d) holds a side box of tips
11. 11.📋 Which list tag shows bullet points? (a) <li> (b) <ul> (c) <ol>
12. 12.⚡ What does JavaScript add to a web page? (a) the page title (b) actions and changes (c) the domain name (d) only colours
13. 13.📝 Which input type is for one line of words? (a) radio (b) text (c) password (d) email
14. 14.🔒 Is the connection to this address scrambled (encrypted)?
    https://www.example.com/maths/tables.html (a) Yes (b) No
15. 15.True or false: <title> goes in the head. (a) False (b) True
16. 16.🔠 How many <h1> headings should a page usually have? (a) 10 (b) 6 (c) 1 (d) 3
17. 17.💬 Which text will NOT show on the page?
    <!-- <p>Rain today</p> -->
    <p>Hello, world!</p>
    <p>Cricket is fun.</p>
    <p>The red kite</p> (a) Rain today (b) Hello, world! (c) The red kite (d) Cricket is fun.
18. 18.🛡️ Online: is it safe to tell a trusted adult? (a) not safe (b) safe
19. 19.⚡ What number does this code print?
    let coins = 5;
    coins = coins + 2;
    coins = coins - 6;
    console.log(coins);
20. 20.🔁 When does the else part run? (a) always (b) when if is false (c) when if is true (d) never
21. 21.🔁 What does this code print?
    let age = 11;
    if (age < 44) {
      console.log("teen");
    } else {
      console.log("child");
    } (a) child (b) teen
22. 22.📄 What is the first line of an HTML5 page? (a) <body> (b) <html> (c) <head> (d) <!DOCTYPE html>
23. 23.🔐 Is iloveyou a strong or a weak password? (a) strong (b) weak
24. 24.🖌️ Which CSS property picks the font style? (a) font-family (b) font-size (c) color (d) font-weight
25. 25.Which of these is a closing tag? (a) <h1> (b) <li> (c) <title> (d) </b>
26. 26.🎯 What kind of selector is .menu? (a) an id selector (b) a class selector (c) an element selector
27. 27.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h4> → <h4> (a) No (b) Yes
28. 28.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 10px;
      }
    }
29. 29.True or false: a code editor shows line numbers. (a) True (b) False
30. 30.🔠 Are headings shown in bold by default? (a) Yes (b) No
31. 31.✍️ Which property is set to italic in this rule?
    p {
      font-weight: bold;
      font-style: italic;
    } (a) font-style (b) italic (c) color (d) font-size
32. 32.True or false: <ul> shows bullet points. (a) True (b) False
33. 33.📦 In the box model, which part is space inside the border? (a) margin (b) border (c) padding (d) content
34. 34.🖌️ What colour are the letters?
    li {
      font-size: 20px;
      color: white;
      background-color: yellow;
      text-align: left;
    } (a) blue (b) yellow (c) white
35. 35.🧩 An opening tag + content + a closing tag together make an ___. (a) editor (b) address (c) attribute (d) element
36. 36.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="bus.jpg" alt="Our school bus" width="50"> (a) An old fort (b) bus.jpg (c) width (d) Our school bus
37. 37.True or false: padding is space inside the border. (a) False (b) True
38. 38.🔍 Which is the odd one out? (a) shows pages from the web (b) hosts websites online (c) turns HTML into a page (d) opens web pages for us
39. 39.⚡ What does this code show?
    let name = "Meera";
    console.log("Welcome, " + name + "!"); (a) Welcome, name! (b) Meera (c) name (d) Welcome, Meera!
40. 40.🔗 Where does this link open?
    <a href="contact.html" target="_blank">Visit the site</a> (a) in the same tab (b) in a new tab

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