Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 496 · 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 of these is true of <aside>? (a) holds a news story (b) holds one blog post (c) holds the main content (d) holds a side box of tips
2. 2.What is <input type="email"> for? (a) hides what you type (b) lets you tick many (c) is for one line of words (d) is for an email address
3. 3.📦 How much space top to bottom (px) does this box take in all, margin included?
   .box {
     height: 150px;
     padding: 10px;
     border: 2px solid black;
     margin: 0px;
   }
4. 4.🌈 Which colour is #ff0000? (a) black (b) red (c) white (d) magenta
5. 5.📝 On how many lines does the browser show this paragraph?
   <p>Stars shine<br>Rivers flow<br>Roses are red</p>
6. 6.🎯 Which element does the selector p style? (a) <h1> (b) <h2 class="note"> (c) <p class="note"> (d) <li id="intro">
7. 7.🚀 Which file should this code go in: let score = 0; (a) index.html (b) style.css (c) script.js
8. 8.✍️ In color: blue; which part is the property? (a) : (b) color (c) blue (d) ;
9. 9.💬 How many paragraphs show on the page?
   <p>Our school trip</p>
   <p>Hello, world!</p>
   <p>The red kite</p>
   <!-- <p>I love mangoes.</p> -->
10. 10.📝 How many paragraphs does this code make?
    <p>Fun facts</p>
    <p>Cricket is fun.</p>
    <h2>Cricket is fun.</h2>
    <p>My pets</p>
11. 11.🔠 Which heading shows the SMALLEST text: <h1>, <h4>, <h2> or <h5>? (a) <h2> (b) <h4> (c) <h5> (d) <h1>
12. 12.🛡️ Online: is it safe to keep passwords secret? (a) safe (b) not safe
13. 13.✍️ What value is given to font-style in this rule?
    body {
      font-size: 20px;
      font-style: italic;
    } (a) font-style (b) red (c) italic (d) 20px
14. 14.📝 On how many lines does the browser show this paragraph?
    <p>Stars shine<br>Kites fly high</p>
15. 15.🔗 Which words do you click on?
    <a href="quiz.html">School news</a> (a) Take the quiz (b) quiz.html (c) School news (d) href
16. 16.✍️ Which property is set to italic in this rule?
    h2 {
      font-style: italic;
      text-align: center;
    } (a) font-size (b) font-style (c) color (d) italic
17. 17.🔠 Which heading shows the SMALLEST text: <h3>, <h5>, <h2> or <h1>? (a) <h3> (b) <h5> (c) <h1> (d) <h2>
18. 18.📄 Can HTML on its own run a game loop? (a) Yes (b) No
19. 19.🎯 What kind of selector is .menu? (a) a class selector (b) an element selector (c) an id selector
20. 20.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 7; i++) {
      total = total + 2;
    }
    console.log(total);
21. 21.True or false: to use a nickname in games is not safe. (a) True (b) False
22. 22.♿ A part of the page is under a <h2> heading. Which tag should its sub-heading use? (a) <h3> (b) <h6> (c) <h2> (d) <h1>
23. 23.📱 The screen is 820px wide. Does the rule inside @media apply?
    p {
      font-size: 24px;
    }
    @media (max-width: 600px) {
      p {
        font-size: 20px;
      }
    } (a) Yes (b) No
24. 24.💪 Which justify-content value puts boxes in the middle? (a) flex-start (b) flex-end (c) space-between (d) center
25. 25.🔠 How many heading levels does HTML have? (a) 3 (b) 6 (c) 4 (d) 10
26. 26.📋 Which list suits a shopping list in any order? (a) <ol> (b) <hr> (c) <br> (d) <ul>
27. 27.✍️ What value is given to font-weight in this rule?
    .note {
      width: 300px;
      font-weight: bold;
    } (a) font-weight (b) 2px solid (c) bold (d) 300px
28. 28.🔁 Which word runs code only when something is true? (a) let (b) log (c) for (d) if
29. 29.✍️ What value is given to color in this rule?
    h2 {
      font-weight: bold;
      background-color: yellow;
      text-align: center;
      color: red;
    } (a) red (b) color (c) 20px (d) center
30. 30.📝 Which input type sends the form? (a) submit (b) number (c) checkbox (d) text
31. 31.⚖️ What colour is the text of this element?
    <p class="menu" id="top">Hi</p>
    CSS:
    .menu { color: purple; }
    #top { color: red; } (a) black (b) purple (c) red (d) white
32. 32.📊 Which tag gives the table a title? (a) <caption> (b) <th> (c) <td> (d) <tr>
33. 33.📝 Does <p> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
34. 34.🔡 Are HTML tag names usually written in small letters? (a) No (b) Yes
35. 35.📝 Which input type picks a day? (a) checkbox (b) text (c) password (d) date
36. 36.📋 Does this list show bullets or numbers?
    <ul>
      <li>Guava</li>
      <li>Litchi</li>
    </ul> (a) bullets (b) numbers
37. 37.📝 How many paragraphs does this code make?
    <p>My pets</p>
    <p>Fun facts</p>
    <p>The red kite</p>
    <p>My best friend</p>
    <p>Our school trip</p>
    <h2>Rain today</h2>
38. 38.🔁 How many numbers does this code print?
    for (let i = 0; i < 11; i = i + 2) {
      console.log(i);
    }
39. 39.📝 You type 5 spaces between two words in a <p>. How does the browser show them? (a) as a dot (b) as a new line (c) as 5 spaces (d) as one space
40. 40.📋 Does this list show bullets or numbers?
    <ul>
      <li>Guava</li>
      <li>Papaya</li>
      <li>Mango</li>
    </ul> (a) bullets (b) numbers

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