Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 482 · 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.🌈 In #rrggbb, which colour do the last two digits give? (a) red (b) white (c) green (d) blue
2. 2.🧱 HTML gives a web page its ___. (a) colours (b) structure (c) sound (d) speed
3. 3.✍️ What value is given to font-weight in this rule?
   li {
     padding: 8px;
     font-weight: bold;
     color: red;
     font-style: italic;
   } (a) bold (b) 2px solid (c) 300px (d) font-weight
4. 4.🧭 Who is helped most by semantic tags? (a) only the printer (b) nobody (c) only the server (d) screen-reader users
5. 5.🏷️ Is </li> an opening tag or a closing tag? (a) an opening tag (b) a closing tag
6. 6.Which of these does CSS do? (a) adds space around boxes (b) puts a picture on a page (c) makes a link (d) makes headings and lists
7. 7.📄 What does the browser tab show for this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>Space Facts</title>
   </head>
   <body>
     <h1>All about me</h1>
     <p>Mars is red.</p>
   </body>
   </html> (a) Space Facts (b) All about me (c) index.html (d) Mars is red.
8. 8.💬 Which text will NOT show on the page?
   <p>Rain today</p>
   <!-- <p>Good morning!</p> -->
   <p>Cricket is fun.</p> (a) Rain today (b) Cricket is fun. (c) Good morning!
9. 9.📊 Are <th> cells shown bold and centred by default? (a) No (b) Yes
10. 10.✍️ How does a CSS comment start? (a) // (b) # (c) /* (d) <!--
11. 11.💬 How many paragraphs show on the page?
    <p>Rain today</p>
    <p>My pets</p>
    <p>The red kite</p>
    <!-- <p>Fun facts</p> -->
12. 12.🔁 How many times does this code print “Hello”?
    for (let i = 1; i <= 3; i++) {
      console.log("Hello");
    }
13. 13.🖼️ Which attribute of <img> is read by screen readers? (a) src (b) height (c) alt (d) width
14. 14.💪 Which justify-content value packs boxes at the start? (a) flex-end (b) space-between (c) center (d) flex-start
15. 15.🧭 Which semantic tag holds a side box of tips? (a) <article> (b) <nav> (c) <main> (d) <aside>
16. 16.📋 Which list tag is an ordered list? (a) <ul> (b) <ol> (c) <li>
17. 17.🔗 What does HyperText mean? (a) text in colour (b) text with links (c) very big text (d) secret text
18. 18.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 24px;
    }
    @media (min-width: 600px) {
      p {
        font-size: 28px;
      }
    }
19. 19.💬 Which text will NOT show on the page?
    <!-- <p>My best friend</p> -->
    <p>Fun facts</p>
    <p>Our school trip</p> (a) Fun facts (b) My best friend (c) Our school trip
20. 20.⚖️ Which selector is the weakest? (a) a class selector (b) an id selector (c) an element selector
21. 21.Which of these is an opening tag? (a) <title> (b) </title> (c) </li> (d) </body>
22. 22.💬 How many paragraphs show on the page?
    <!-- <p>Our school trip</p> -->
    <!-- <p>Cricket is fun.</p> -->
    <!-- <p>The red kite</p> -->
    <p>Good morning!</p>
23. 23.♿ What does good colour contrast mean? (a) many bright colours (b) only red text (c) no colours at all (d) text stands out clearly
24. 24.⚖️ What colour is the text of this element?
    <h1 class="star" id="intro">Hi</h1>
    CSS:
    h1 { color: green; }
    h1 { color: red; } (a) green (b) black (c) red (d) yellow
25. 25.📝 How many <input> tags are in this form?
    <form>
      <input type="date">
      <input type="password">
      <input type="checkbox">
      <input type="number">
      <input type="submit" value="Send">
    </form>
26. 26.What does color do? (a) colours behind the text (b) makes letters bigger (c) sets the letter colour (d) picks the font style
27. 27.📋 Which list tag lists things in any order? (a) <ol> (b) <li> (c) <ul>
28. 28.🧭 Is <header> semantic or not semantic? (a) not semantic (b) semantic
29. 29.🔗 Which words do you click on?
    <a href="about.html">Art corner</a> (a) about.html (b) Art corner (c) href (d) School news
30. 30.🔍 One closing tag is missing. Which one?
    <h3>I love mangoes.
    <u>My best friend</u>
    <i>Our school trip</i> (a) </u> (b) </i> (c) </h3> (d) </h2>
31. 31.🔠 Which tag is the least important heading? (a) <h3> (b) <h6> (c) <p> (d) <h1>
32. 32.♿ Does this help everyone, or make the page harder to use: colour as the only clue? (a) makes it harder (b) helps everyone
33. 33.True or false: a web server stores a website’s files. (a) False (b) True
34. 34.📝 Does <input> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
35. 35.True or false: the content is the text or picture. (a) True (b) False
36. 36.🎨 Which tag holds CSS inside the head? (a) <body> (b) <style> (c) <css> (d) <script>
37. 37.💬 How does an HTML comment start? (a) /* (b) # (c) // (d) <!--
38. 38.🔠 How many headings are in this code?
    <h1>Our school trip</h1>
    <p>Cricket is fun.</p>
    <h4>I love mangoes.</h4>
    <h2>The red kite</h2>
39. 39.🖌️ What colour are the letters?
    h2 {
      background-color: black;
      text-align: left;
      font-size: 16px;
      color: red;
    } (a) red (b) yellow (c) black
40. 40.🎨 One CSS file can style how many pages? (a) only one word (b) no pages (c) many pages (d) only one image

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