Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 545 · 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 heading shows the SMALLEST text: <h4>, <h3>, <h6> or <h2>? (a) <h3> (b) <h6> (c) <h2> (d) <h4>
2. 2.📱 The screen is 1366px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 12px;
   }
   @media (min-width: 1024px) {
     p {
       font-size: 14px;
     }
   }
3. 3.📱 The screen is 320px wide. Does the rule inside @media apply?
   p {
     font-size: 12px;
   }
   @media (max-width: 480px) {
     p {
       font-size: 10px;
     }
   } (a) Yes (b) No
4. 4.🖼️ Which attribute of <img> sets how wide it is? (a) height (b) width (c) alt (d) src
5. 5.⚖️ Which selector is the strongest? (a) a class selector (b) an element selector (c) an id selector
6. 6.True or false: HTML makes a link. (a) True (b) False
7. 7.📝 At most, how many of these can be chosen at the same time?
   <form>
     <input type="radio" name="fruit"> Banana
     <input type="radio" name="fruit"> Litchi
     <input type="radio" name="fruit"> Mango
   </form>
8. 8.True or false: <ul> goes inside ul or ol. (a) True (b) False
9. 9.🌍 What is the path in this URL?
   http://learn.example.com/art/gallery.html (a) learn.example.com (b) http (c) /news/today.html (d) /art/gallery.html
10. 10.🌈 Hex digits go 0 to 9, then A to which letter? (a) Z (b) F (c) J (d) G
11. 11.🔗 Which attribute holds the address of a link? (a) id (b) alt (c) src (d) href
12. 12.🌍 What does a web address (URL) tell the browser? (a) your password (b) where the page is (c) the page colour (d) how old you are
13. 13.⚖️ What colour is the text of this element?
    <p class="big" id="hero">Hi</p>
    CSS:
    #hero { color: white; }
    .big { color: yellow; }
    p { color: red; } (a) white (b) purple (c) yellow (d) red
14. 14.🖌️ What colour are the letters?
    li {
      background-color: purple;
      text-align: center;
      font-size: 36px;
      color: red;
    } (a) white (b) red (c) purple
15. 15.🌈 Which colour of light is strongest in rgb(54, 211, 7)? (a) red (b) green (c) blue
16. 16.🔗 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
17. 17.🔁 Which word runs code only when something is true? (a) log (b) let (c) for (d) if
18. 18.True or false: <th> makes a heading cell. (a) False (b) True
19. 19.🖼️ Does <img> need a closing tag? (a) No (b) Yes
20. 20.📋 How many items does this list show?
    <ul>
      <li>Guava</li>
      <li>Jamun</li>
      <li>Banana</li>
    </ul>
21. 21.📱 The screen is 540px wide. Does the rule inside @media apply?
    p {
      font-size: 12px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 8px;
      }
    } (a) Yes (b) No
22. 22.🏷️ Which is the closing tag for <u>? (a) </u> (b) <u> (c) <u/> (d) <\u>
23. 23.🚀 Which file should this code go in: console.log(5 + 2); (a) index.html (b) script.js (c) style.css
24. 24.📱 The screen is 700px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 768px) {
      p {
        font-size: 10px;
      }
    }
25. 25.💬 Which text will NOT show on the page?
    <!-- <p>Hello, world!</p> -->
    <p>Cricket is fun.</p>
    <p>I love mangoes.</p> (a) I love mangoes. (b) Hello, world! (c) Cricket is fun.
26. 26.True or false: HTML on its own cannot make a form. (a) True (b) False
27. 27.♿ Is this heading order correct (no level skipped)?
    <h1> → <h3> → <h2> → <h2> (a) Yes (b) No
28. 28.🔠 Which heading shows the BIGGEST text: <h1>, <h3>, <h6> or <h4>? (a) <h4> (b) <h3> (c) <h6> (d) <h1>
29. 29.📄 Where does the text of <title> appear? (a) nowhere (b) at the bottom (c) on the browser tab (d) in a big heading
30. 30.True or false: in <img>, alt is read by screen readers. (a) False (b) True
31. 31.Which of these does HTML do? (a) makes a link (b) checks a quiz answer (c) rounds box corners (d) reacts to a button click
32. 32.⚡ Which word makes a new variable? (a) make (b) give (c) let (d) put
33. 33.🔠 Which heading shows the BIGGEST text: <h3>, <h1>, <h2> or <h6>? (a) <h6> (b) <h1> (c) <h2> (d) <h3>
34. 34.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 10px;
      }
    }
35. 35.🔠 Which heading shows the BIGGEST text: <h1>, <h5>, <h2> or <h4>? (a) <h4> (b) <h2> (c) <h5> (d) <h1>
36. 36.✍️ How many declarations (property: value pairs) are in this rule?
    p {
      font-size: 20px;
      padding: 8px;
      border: 2px solid;
      width: 300px;
    }
37. 37.🖼️ Which tag puts a picture on a page? (a) <p> (b) <a> (c) <pic> (d) <img>
38. 38.🖌️ Where does the text sit on its line?
    h1 {
      background-color: blue;
      font-size: 24px;
      color: orange;
      text-align: right;
    } (a) on the right (b) on the left (c) in the middle
39. 39.🔍 Which is the odd one out? (a) shows pages from the web (b) opens web pages for us (c) turns HTML into a page (d) sends pages over the net
40. 40.💬 Which text will NOT show on the page?
    <!-- <p>Hello, world!</p> -->
    <p>Fun facts</p>
    <p>My pets</p> (a) Fun facts (b) My pets (c) Hello, world!

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