Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 913 · 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.🔁 What is the LAST number this code prints?
   for (let i = 0; i < 18; i = i + 2) {
     console.log(i);
   }
2. 2.🎯 Which element does the selector li style? (a) <p id="logo"> (b) <span class="star"> (c) <li class="star"> (d) <div>
3. 3.📦 In the box model, which part is the gap round content? (a) content (b) padding (c) margin (d) border
4. 4.⚖️ What colour is the text of this element?
   <p class="note" id="hero">Hi</p>
   CSS:
   p { color: red; }
   p { color: black; } (a) orange (b) yellow (c) red (d) black
5. 5.🖼️ Which tag puts a picture on a page? (a) <a> (b) <p> (c) <pic> (d) <img>
6. 6.⚖️ What colour is the text of this element?
   <h1 class="star" id="top">Hi</h1>
   CSS:
   #top { color: white; }
   #top { color: green; } (a) black (b) purple (c) green (d) white
7. 7.🔍 Which line is missing its closing tag?
   line 1: <p>Our school trip
   line 2: <b>Fun facts</b>
   line 3: <small>My best friend</small> (a) line 3 (b) line 2 (c) line 1
8. 8.📝 How many paragraphs does this code make?
   <p>Cricket is fun.</p>
   <h2>My pets</h2>
   <h2>My pets</h2>
   <h2>Rain today</h2>
   <p>My best friend</p>
   <h2>The red kite</h2>
9. 9.🧭 Which semantic tag holds the logo and title? (a) <header> (b) <footer> (c) <nav> (d) <article>
10. 10.📝 How many <input> tags are in this form?
    <form>
      <input type="number">
      <input type="date">
      <input type="submit" value="Send">
    </form>
11. 11.🔒 Is the connection to this address scrambled (encrypted)?
    http://learn.example.com/news/today.html (a) Yes (b) No
12. 12.📱 Responsive design means a page ___. (a) is only for laptops (b) never changes (c) has no pictures (d) fits every screen
13. 13.🌍 Which one is the page’s address? (a) the URL (b) HTTPS (c) the server (d) the browser
14. 14.True or false: <table> holds the whole table. (a) False (b) True
15. 15.🖌️ How big is the text, in px?
    h1 {
      font-size: 40px;
      text-align: left;
      background-color: white;
      color: blue;
    }
16. 16.⚖️ What colour is the text of this element?
    <h1 class="big" id="intro">Hi</h1>
    CSS:
    #intro { color: black; }
    h1 { color: yellow; }
    .big { color: red; } (a) orange (b) yellow (c) red (d) black
17. 17.💬 Which text will NOT show on the page?
    <p>My pets</p>
    <p>My best friend</p>
    <!-- <p>Hello, world!</p> --> (a) My best friend (b) Hello, world! (c) My pets
18. 18.🚀 Should file names have spaces, like my page.html? (a) Yes (b) No
19. 19.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 250px;
      justify-content: flex-end;
    }
    Inside are 2 boxes, each 100px wide (no margins).
20. 20.📝 At most, how many of these can be chosen at the same time?
    <form>
      <input type="radio" name="sport"> Hockey
      <input type="radio" name="sport"> Kabaddi
      <input type="radio" name="sport"> Football
      <input type="radio" name="sport"> Chess
      <input type="radio" name="sport"> Cricket
    </form>
21. 21.True or false: “skipping heading levels” makes the page harder to use. (a) False (b) True
22. 22.🌐 Which one answers page requests? (a) a web server (b) a web browser (c) a code editor
23. 23.🔒 Is the connection to this address scrambled (encrypted)?
    https://school.example.in/maths/tables.html (a) No (b) Yes
24. 24.✍️ Which sign goes between a property and its value? (a) = (b) - (c) : (d) ;
25. 25.True or false: <li> lists steps in order. (a) True (b) False
26. 26.🔍 Which is the odd one out? (a) sets colours and fonts (b) changes the text size (c) rounds box corners (d) changes the page live
27. 27.🔍 One closing tag is missing. Which one?
    <p>I love mangoes.</p>
    <h3>My best friend
    <em>Hello, world!</em> (a) </u> (b) </p> (c) </em> (d) </h3>
28. 28.📝 Does <img> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
29. 29.🏷️ HTML marks up text using ___. (a) wires (b) keys (c) tags (d) pixels
30. 30.Which of these does HTML do? (a) reacts to a button click (b) checks a quiz answer (c) adds space around boxes (d) makes a link
31. 31.🖌️ How big is the text, in px?
    p {
      color: blue;
      background-color: red;
      font-size: 24px;
      text-align: center;
    }
32. 32.✍️ Which property is set to 20px in this rule?
    .note {
      font-size: 20px;
      margin: 10px;
      padding: 8px;
    } (a) background-color (b) 20px (c) text-align (d) font-size
33. 33.🌗 Is light grey on white easy or hard to read? (a) hard to read (b) easy to read
34. 34.🔐 Is S0lar!Pen#8 a strong or a weak password? (a) weak (b) strong
35. 35.♿ A part of the page is under a <h2> heading. Which tag should its sub-heading use? (a) <h2> (b) <h5> (c) <h4> (d) <h3>
36. 36.True or false: <title> goes in the head. (a) False (b) True
37. 37.✍️ How many declarations (property: value pairs) are in this rule?
    h1 {
      font-size: 20px;
      font-style: italic;
      border: 2px solid;
      text-align: center;
    }
38. 38.📊 How many rows does this table have?
    <table>
      <tr><td>Mango</td><td>Mango</td></tr>
      <tr><td>Jamun</td><td>Jamun</td></tr>
    </table>
39. 39.🔍 Which is the odd one out? (a) opens web pages for us (b) shows pages from the web (c) saves our .html files (d) turns HTML into a page
40. 40.💪 Which justify-content value puts boxes in the middle? (a) center (b) flex-start (c) space-between (d) flex-end

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