Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 895 · 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 many items does this list show?
   <ol>
     <li>Papaya</li>
     <li>Litchi</li>
     <li>Guava</li>
     <li>Grapes</li>
     <li>Jamun</li>
   </ol>
2. 2.Which of these is safe to do online? (a) check for https first (b) meet an online stranger (c) share your password (d) post your home address
3. 3.💬 Which text will NOT show on the page?
   <p>The red kite</p>
   <p>My pets</p>
   <p>Rain today</p>
   <!-- <p>Fun facts</p> --> (a) The red kite (b) Rain today (c) My pets (d) Fun facts
4. 4.True or false: HTML gives the page structure. (a) False (b) True
5. 5.True or false: “images with no alt” helps everyone use the page. (a) True (b) False
6. 6.🌈 In #003500 the green part is the hex number 35. What is it as a normal number?
7. 7.🔗 Which code links to about.html? (a) <a href="about.html"> (b) <a alt="about.html"> (c) <a src="about.html"> (d) <link about.html>
8. 8.🔍 Which is the odd one out? (a) saves our .html files (b) has an address bar (c) shows pages from the web (d) opens web pages for us
9. 9.💪 Which flexbox property turns on flexbox? (a) align-items (b) gap (c) justify-content (d) display: flex
10. 10.📝 Which input type takes only numbers? (a) email (b) submit (c) number (d) checkbox
11. 11.True or false: <input type="email"> is for an email address. (a) True (b) False
12. 12.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 170px;
      justify-content: space-between;
    }
    Inside are 2 boxes, each 60px wide (no margins).
13. 13.Which of these goes in the head? (a) <h1> (b) <style> (c) <p> (d) <a>
14. 14.🧭 Is <span> semantic or not semantic? (a) not semantic (b) semantic
15. 15.🔁 Which word runs code only when something is true? (a) for (b) let (c) log (d) if
16. 16.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="bus.jpg" alt="Our school bus" width="300"> (a) bus.jpg (b) width (c) Our school bus (d) An old fort
17. 17.True or false: a web server saves our .html files. (a) True (b) False
18. 18.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 20px;
    }
    @media (min-width: 480px) {
      p {
        font-size: 22px;
      }
    }
19. 19.🧭 Is <aside> semantic or not semantic? (a) not semantic (b) semantic
20. 20.📋 Which list shows the steps of a recipe best? (a) <ul> (b) <br> (c) <ol> (d) <hr>
21. 21.🌈 In #rrggbb, which colour do the last two digits give? (a) white (b) green (c) red (d) blue
22. 22.🛡️ Is it safe to use the same password on every site? (a) No (b) Yes
23. 23.💪 How wide (px) is each gap between two boxes?
    .row {
      display: flex;
      width: 220px;
      justify-content: space-between;
    }
    Inside are 4 boxes, each 40px wide (no margins).
24. 24.True or false: .box { padding: 8px; } goes in style.css. (a) False (b) True
25. 25.True or false: the border is the line round the box. (a) True (b) False
26. 26.🖌️ What colour is behind the letters?
    li {
      color: red;
      text-align: left;
      background-color: blue;
      font-size: 28px;
    } (a) blue (b) red (c) white
27. 27.True or false: “tiny grey text” makes the page harder to use. (a) False (b) True
28. 28.💬 Which text will NOT show on the page?
    <p>My best friend</p>
    <!-- <p>The red kite</p> -->
    <p>Rain today</p>
    <p>Cricket is fun.</p> (a) Cricket is fun. (b) Rain today (c) My best friend (d) The red kite
29. 29.📝 You type 5 spaces between two words in a <p>. How does the browser show them? (a) as one space (b) as 5 spaces (c) as a new line (d) as a dot
30. 30.🖼️ How many pixels wide is the picture drawn?
    <img src="fort.jpg" alt="An old fort" width="350">
31. 31.📄 Where does the text of <title> appear? (a) at the bottom (b) on the browser tab (c) in a big heading (d) nowhere
32. 32.📋 Which tag goes around each item of a list? (a) <ul> (b) <p> (c) <ol> (d) <li>
33. 33.📊 Which tag holds the whole table? (a) <caption> (b) <th> (c) <table> (d) <td>
34. 34.✍️ What value is given to color in this rule?
    h1 {
      color: red;
      font-size: 20px;
    } (a) color (b) 20px (c) red (d) center
35. 35.💬 Which text will NOT show on the page?
    <p>Good morning!</p>
    <p>I love mangoes.</p>
    <!-- <p>Rain today</p> --> (a) Good morning! (b) I love mangoes. (c) Rain today
36. 36.🚀 Which file should this code go in: <h1>My Site</h1> (a) index.html (b) script.js (c) style.css
37. 37.🔢 On a typical page, from top to bottom, which comes first: “<header>” or “<nav>”? (a) <header> (b) <nav>
38. 38.🚀 Which file should this code go in: alert(score); (a) style.css (b) index.html (c) script.js
39. 39.🎯 What kind of selector is #logo? (a) an id selector (b) a class selector (c) an element selector
40. 40.📊 Are <th> cells shown bold and centred by default? (a) Yes (b) No

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