Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 172 · 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.🖌️ How big is the text, in px?
   li {
     font-size: 40px;
     color: yellow;
     background-color: red;
     text-align: right;
   }
2. 2.True or false: <title> goes in the head. (a) True (b) False
3. 3.🎯 Which element does the selector div style? (a) <h1 id="logo"> (b) <div class="star"> (c) <p class="star"> (d) <span>
4. 4.⚖️ Two rules with the same selector set a colour. Which one wins? (a) the later one (b) the first one (c) neither (d) the shorter one
5. 5.📄 What is the first line of an HTML5 page? (a) <html> (b) <!DOCTYPE html> (c) <body> (d) <head>
6. 6.📝 On how many lines does the browser show this paragraph?
   <p>Birds sing<br>Rivers flow<br>Kites fly high</p>
7. 7.🌈 Which colour is #ffffff? (a) white (b) magenta (c) yellow (d) blue
8. 8.🔁 Which word runs code only when something is true? (a) let (b) if (c) for (d) log
9. 9.📱 The screen is 320px wide. Does the rule inside @media apply?
   p {
     font-size: 16px;
   }
   @media (max-width: 480px) {
     p {
       font-size: 14px;
     }
   } (a) No (b) Yes
10. 10.🖌️ Which CSS property makes the text bold? (a) font-weight (b) color (c) font-size (d) background-color
11. 11.⚡ What does this code show?
    let name = "Meera";
    console.log("Well done, " + name + "!"); (a) Meera (b) Well done, name! (c) name (d) Well done, Meera!
12. 12.🌈 Which colour of light is strongest in rgb(176, 103, 105)? (a) blue (b) red (c) green
13. 13.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is free (b) the site is a game (c) the data is scrambled (d) the site is fast
14. 14.🌍 Which one shows the page to you? (a) the URL (b) the server (c) HTTPS (d) the browser
15. 15.🌐 Which one stores a website’s files? (a) a web server (b) a code editor (c) a web browser
16. 16.🌍 What do we call the computer that stores a website? (a) a server (b) a printer (c) a keyboard (d) a mouse
17. 17.🏷️ Is </li> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
18. 18.♿ Who uses a screen reader? (a) only robots (b) people who are blind (c) only coders (d) only teachers
19. 19.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 210px;
      padding: 5px;
      border: 2px solid black;
      margin: 0px;
    }
20. 20.True or false: <input type="radio"> lets you pick only one. (a) True (b) False
21. 21.♿ A part of the page is under a <h4> heading. Which tag should its sub-heading use? (a) <h6> (b) <h5> (c) <h2> (d) <h4>
22. 22.🧭 Is <article> semantic or not semantic? (a) not semantic (b) semantic
23. 23.Which of these is an empty tag? (a) <title> (b) <hr> (c) <b> (d) <li>
24. 24.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 9; i++) {
      total = total + 3;
    }
    console.log(total);
25. 25.📝 Does <li> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
26. 26.🌐 Which one turns HTML into a page? (a) a web server (b) a web browser (c) a code editor
27. 27.Which of these is true of <aside>? (a) holds extra side notes (b) sits at the bottom (c) holds the logo and title (d) sits at the very top
28. 28.📝 Does <meta> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
29. 29.🧩 Which language puts a picture on a page? (a) JavaScript (b) CSS (c) HTML
30. 30.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 190px;
      padding: 5px;
      border: 4px solid black;
      margin: 20px;
    }
31. 31.🔍 Which line is missing its closing tag?
    line 1: <i>I love mangoes.</i>
    line 2: <p>Our school trip
    line 3: <h3>Cricket is fun.</h3> (a) line 2 (b) line 1 (c) line 3
32. 32.Which of these has a closing tag? (a) <br> (b) <b> (c) <hr> (d) <input>
33. 33.🔍 One closing tag is missing. Which one?
    <small>Our school trip</small>
    <p>The red kite
    <h2>I love mangoes.</h2> (a) </i> (b) </small> (c) </p> (d) </h2>
34. 34.📄 Can HTML on its own pick a random number? (a) Yes (b) No
35. 35.True or false: a code editor shows line numbers. (a) False (b) True
36. 36.📊 Which tag gives the table a title? (a) <caption> (b) <tr> (c) <th> (d) <td>
37. 37.♿ Is this heading order correct (no level skipped)?
    <h1> → <h2> → <h2> → <h4> (a) Yes (b) No
38. 38.📋 Does this list show bullets or numbers?
    <ul>
      <li>Litchi</li>
      <li>Jamun</li>
      <li>Mango</li>
    </ul> (a) numbers (b) bullets
39. 39.True or false: HTML on its own cannot make a form. (a) True (b) False
40. 40.⚖️ What colour is the text of this element?
    <p class="box" id="end">Hi</p>
    CSS:
    .box { color: yellow; }
    .box { color: white; } (a) orange (b) red (c) white (d) yellow

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