Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 109 · 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 file should this code go in: <ul><li>Art</li></ul> (a) style.css (b) index.html (c) script.js
2. 2.🔢 In a basic web page file, which comes first: “<body>” or “</body>”? (a) </body> (b) <body>
3. 3.✍️ What is the selector in this CSS rule?
   p {
     margin: 10px;
     background-color: yellow;
     font-size: 20px;
     width: 300px;
   } (a) p (b) margin (c) .note (d) yellow
4. 4.⚡ What does alert() show? (a) a table (b) a new tab (c) a picture (d) a pop-up box
5. 5.🔠 Which heading shows the SMALLEST text: <h6>, <h5>, <h1> or <h3>? (a) <h3> (b) <h6> (c) <h5> (d) <h1>
6. 6.🔗 Where does this link open?
   <a href="about.html">School news</a> (a) in a new tab (b) in the same tab
7. 7.🚀 Which file should this code go in: <h1>My Site</h1> (a) style.css (b) index.html (c) script.js
8. 8.🔍 Which is the odd one out? (a) sets colours and fonts (b) adds space around boxes (c) makes a link (d) changes the text size
9. 9.🛡️ Online: is it safe to tell a trusted adult? (a) not safe (b) safe
10. 10.📋 What number does the browser show next to “Banana”?
    <ol>
      <li>Orange</li>
      <li>Mango</li>
      <li>Guava</li>
      <li>Banana</li>
    </ol>
11. 11.⚡ A JavaScript file usually ends with which extension? (a) .css (b) .html (c) .jpg (d) .js
12. 12.True or false: #end is an id selector. (a) False (b) True
13. 13.🛡️ Is it safe to use the same password on every site? (a) No (b) Yes
14. 14.🧭 Is <section> semantic or not semantic? (a) not semantic (b) semantic
15. 15.🎯 Which CSS selector matches this element?
    <h1 class="menu" id="main">Hello</h1> (a) h1 (b) #logo (c) .main (d) #menu
16. 16.True or false: <aside> holds a news story. (a) False (b) True
17. 17.📝 You type 5 spaces between two words in a <p>. How does the browser show them? (a) as a new line (b) as one space (c) as a dot (d) as 5 spaces
18. 18.🌈 In #000005 the blue part is the hex number 05. What is it as a normal number?
19. 19.📄 Can HTML on its own show paragraphs? (a) No (b) Yes
20. 20.✍️ Which property is set to italic in this rule?
    .note {
      background-color: yellow;
      color: red;
      font-style: italic;
      margin: 10px;
    } (a) font-style (b) color (c) font-size (d) italic
21. 21.🌗 Is blue on purple easy or hard to read? (a) hard to read (b) easy to read
22. 22.🎯 Which sign starts an id selector? (a) & (b) # (c) @ (d) .
23. 23.💬 How many paragraphs show on the page?
    <p>Hello, world!</p>
    <!-- <p>I love mangoes.</p> -->
    <p>The red kite</p>
24. 24.📋 Which list shows the steps of a recipe best? (a) <br> (b) <ol> (c) <ul> (d) <hr>
25. 25.📋 Which tag goes around each item of a list? (a) <ol> (b) <ul> (c) <p> (d) <li>
26. 26.🌍 Which one sends the page back? (a) the server (b) the browser (c) HTTPS (d) the URL
27. 27.Which of these is safe to do online? (a) meet an online stranger (b) share your password (c) tell a trusted adult (d) type a password on http
28. 28.📝 What does <p> make? (a) a link (b) a paragraph (c) a picture (d) a table
29. 29.🔍 One closing tag is missing. Which one?
    <h1>Good morning!
    <h2>Fun facts</h2>
    <h3>Our school trip</h3> (a) </h1> (b) </b> (c) </h2> (d) </h3>
30. 30.⚖️ What colour is the text of this element?
    <p class="menu" id="intro">Hi</p>
    CSS:
    #intro { color: blue; }
    .menu { color: white; } (a) green (b) yellow (c) white (d) blue
31. 31.🎯 Which CSS selector matches this element?
    <div class="note" id="hero">Hello</div> (a) span (b) #top (c) div (d) .hero
32. 32.🔢 When you open a web page, which comes first: “you type the URL” or “the browser asks it”? (a) the browser asks it (b) you type the URL
33. 33.📄 Where does <title> go: in the head or in the body? (a) in the body (b) in the head
34. 34.🔢 In a basic web page file, which comes FIRST? (a) <!DOCTYPE html> (b) </html> (c) </head> (d) <body>
35. 35.🔢 When you open a web page, what comes right after “the server sends files”? (a) DNS finds the server (b) you type the URL (c) the browser shows it (d) the browser asks it
36. 36.🔍 Which is the odd one out? (a) turns HTML into a page (b) hosts websites online (c) opens web pages for us (d) has an address bar
37. 37.True or false: <ol> shows bullet points. (a) False (b) True
38. 38.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 220px;
      justify-content: flex-end;
    }
    Inside are 4 boxes, each 40px wide (no margins).
39. 39.📊 How many heading cells (<th>) does this table have?
    <table>
      <tr><th>Name</th><th>Fruit</th></tr>
      <tr><td>Grapes</td><td>Jamun</td></tr>
      <tr><td>Banana</td><td>Grapes</td></tr>
    </table>
40. 40.Which of these is true of a web server? (a) shows line numbers (b) colours code to help us (c) has an address bar (d) stores a website’s files

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