Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 124 · 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 element does the selector .star style? (a) <li id="star"> (b) <div class="note"> (c) <li class="menu"> (d) <li class="star">
2. 2.⚖️ Which selector is the weakest? (a) an id selector (b) a class selector (c) an element selector
3. 3.✍️ CSS declarations go inside which brackets? (a) [ ] (b) ( ) (c) < > (d) { }
4. 4.📋 Does this list show bullets or numbers?
   <ol>
     <li>Grapes</li>
     <li>Papaya</li>
   </ol> (a) bullets (b) numbers
5. 5.🔢 To build and share your first web page, which comes first: “plan what to show” or “publish it online”? (a) publish it online (b) plan what to show
6. 6.True or false: <input type="text"> is for one line of words. (a) False (b) True
7. 7.🔠 Which heading shows the BIGGEST text: <h3>, <h1>, <h5> or <h6>? (a) <h5> (b) <h3> (c) <h6> (d) <h1>
8. 8.🔠 Which heading shows the SMALLEST text: <h1>, <h5>, <h6> or <h3>? (a) <h5> (b) <h1> (c) <h6> (d) <h3>
9. 9.📝 What does <p> make? (a) a paragraph (b) a table (c) a link (d) a picture
10. 10.⚡ Which tag holds JavaScript in a page? (a) <js> (b) <code> (c) <style> (d) <script>
11. 11.🔁 How many times does this code print “Hi”?
    for (let i = 3; i < 7; i++) {
      console.log("Hi");
    }
12. 12.✍️ What value is given to font-weight in this rule?
    p {
      text-align: center;
      font-weight: bold;
      padding: 8px;
    } (a) 2px solid (b) font-weight (c) 300px (d) bold
13. 13.🔢 When you open a web page, what comes right after “you type the URL”? (a) the browser asks it (b) DNS finds the server (c) the browser shows it (d) the server sends files
14. 14.📋 How many items does this list show?
    <ol>
      <li>Papaya</li>
      <li>Jamun</li>
      <li>Guava</li>
      <li>Banana</li>
      <li>Orange</li>
      <li>Litchi</li>
    </ol>
15. 15.Which of these is padding? (a) the gap to other boxes (b) space inside the border (c) the text or picture (d) a solid or dotted edge
16. 16.📄 Where does <p> go: in the head or in the body? (a) in the head (b) in the body
17. 17.⚖️ What colour is the text of this element?
    <p class="star" id="logo">Hi</p>
    CSS:
    p { color: orange; }
    p { color: black; } (a) yellow (b) orange (c) green (d) black
18. 18.True or false: <meta> is an empty tag. (a) True (b) False
19. 19.📱 The screen is 1100px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 10px;
      }
    } (a) Yes (b) No
20. 20.✍️ Which property is set to center in this rule?
    p {
      color: red;
      text-align: center;
    } (a) text-align (b) margin (c) center (d) background-color
21. 21.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 160px;
      padding: 25px;
      border: 1px solid black;
      margin: 20px;
    }
22. 22.🏷️ Which is the closing tag for <strong>? (a) <strong/> (b) <\strong> (c) </strong> (d) <strong>
23. 23.📋 Which list tag lists steps in order? (a) <li> (b) <ol> (c) <ul>
24. 24.📄 Where does <h1> go: in the head or in the body? (a) in the head (b) in the body
25. 25.📱 min-width: 800px applies when the screen is ___. (a) exactly 100px (b) turned off (c) 800px or narrower (d) 800px or wider
26. 26.📝 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 dot (d) as a new line
27. 27.⚡ Where does console.log() show its output? (a) in the address bar (b) on the printer (c) on the title bar (d) in the console
28. 28.True or false: in <img>, height shows if the image fails. (a) False (b) True
29. 29.🔁 What does this code print?
    let age = 25;
    if (age >= 32) {
      console.log("teen");
    } else {
      console.log("child");
    } (a) child (b) teen
30. 30.📄 Can HTML on its own count button clicks? (a) Yes (b) No
31. 31.📦 How much space top to bottom (px) does this box take in all, margin included?
    .box {
      height: 100px;
      padding: 5px;
      border: 2px solid black;
      margin: 0px;
    }
32. 32.🎯 Which CSS selector matches this element?
    <div class="note" id="top">Hello</div> (a) #intro (b) span (c) div (d) #note
33. 33.🔗 What does target="_blank" do to a link? (a) makes it blank (b) opens it in a new tab (c) makes it bold (d) hides the link
34. 34.📊 Which tag makes one table row? (a) <table> (b) <tr> (c) <th> (d) <caption>
35. 35.📝 Does <meta> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
36. 36.Which of these is true of <nav>? (a) holds the menu of links (b) sits at the very top (c) is the page’s key part (d) sits at the bottom
37. 37.🖌️ Which CSS property picks the font style? (a) text-align (b) font-family (c) background-color (d) color
38. 38.📝 Does <p> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
39. 39.📱 The screen is 1366px wide. Does the rule inside @media apply?
    p {
      font-size: 24px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 22px;
      }
    } (a) No (b) Yes
40. 40.💬 Which text will NOT show on the page?
    <p>Hello, world!</p>
    <p>Rain today</p>
    <p>Fun facts</p>
    <!-- <p>My best friend</p> --> (a) Fun facts (b) My best friend (c) Hello, world! (d) Rain today

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