← Web development final test lesson New set →

Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 181 · 40 questions
TalentJR

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.

NameDateTime takenScore ___ / 40
  1. 1.True or false: <aside> holds extra side notes. (a) False (b) True
  2. 2.📝 Does <meta> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
  3. 3.📄 Can HTML on its own show paragraphs? (a) Yes (b) No
  4. 4.🔁 What number does this code print?
    let total = 0;
    for (let i = 1; i <= 3; i++) {
      total = total + 5;
    }
    console.log(total);
  5. 5.🖼️ Which picture file does the browser load?
    <img src="fort.jpg" alt="An old fort" width="350">     (a) kite.png (b) An old fort (c) fort.jpg (d) tiger.jpg
  6. 6.⚖️ What colour is the text of this element?
    <p class="star" id="top">Hi</p>
    CSS:
    .star { color: black; }
    .star { color: green; }     (a) orange (b) purple (c) black (d) green
  7. 7.🛡️ A pop-up says you won a prize and asks for your password. What do you do? (a) click it twice (b) share it with friends (c) type the password (d) close it, tell an adult
  8. 8.⚡ What number does this code print?
    let apples = 8;
    apples = apples + 17;
    apples = apples - 9;
    console.log(apples);
  9. 9.True or false: <style> goes in the body. (a) False (b) True
  10. 10.🖼️ The picture cannot load. Which text does the browser show instead?
    <img src="bus.jpg" alt="Our school bus" width="300">     (a) width (b) bus.jpg (c) Our school bus (d) An old fort
  11. 11.✍️ Which property is set to 2px solid in this rule?
    li {
      width: 300px;
      border: 2px solid;
      font-style: italic;
      background-color: yellow;
    }     (a) font-style (b) border (c) 2px solid (d) width
  12. 12.🧭 Which semantic tag holds the main content? (a) <nav> (b) <main> (c) <aside> (d) <article>
  13. 13.🖼️ Does <img> need a closing tag? (a) No (b) Yes
  14. 14.🔠 How many headings are in this code?
    <h1>Hello, world!</h1>
    <h4>I love mangoes.</h4>
    <p>Our school trip</p>
  15. 15.🧩 Which language lays out the page? (a) HTML (b) JavaScript (c) CSS
  16. 16.True or false: <h1> is an empty tag. (a) False (b) True
  17. 17.🔐 Is 111111 a strong or a weak password? (a) weak (b) strong
  18. 18.📝 On how many lines does the browser show this paragraph?
    <p>Sky is blue<br>Roses are red<br>Birds sing<br>Stars shine</p>
  19. 19.🚀 Which file should this code go in: <h1>My Site</h1> (a) script.js (b) style.css (c) index.html
  20. 20.True or false: a code editor stores a website’s files. (a) True (b) False
  21. 21.Which of these is an empty tag? (a) <br> (b) <li> (c) <h1> (d) <ul>
  22. 22.🎯 Which element does the selector #main style? (a) <h1 id="main"> (b) <h1 id="logo"> (c) <h2 class="menu"> (d) <h1 class="main">
  23. 23.⚡ Which JavaScript word writes in the console? (a) let (b) if (c) for (d) console.log()
  24. 24.⚡ Which word makes a new variable? (a) let (b) make (c) give (d) put
  25. 25.✍️ Which sign goes between a property and its value? (a) : (b) ; (c) - (d) =
  26. 26.🖌️ Which CSS property picks the font style? (a) font-family (b) background-color (c) text-align (d) font-size
  27. 27.🚀 Which file is best for the colours and fonts? (a) index.html (b) script.js (c) photo.jpg (d) style.css
  28. 28.📦 How much space across (px) does this box take in all, margin included?
    .box {
      width: 230px;
      padding: 30px;
      border: 2px solid black;
      margin: 5px;
    }
  29. 29.✍️ Which property is set to red in this rule?
    .box {
      font-size: 20px;
      color: red;
    }     (a) font-size (b) red (c) text-align (d) color
  30. 30.⚡ What number does this code print?
    let marks = 26;
    marks = marks + 18;
    marks = marks - 7;
    console.log(marks);
  31. 31.📝 On how many lines does the browser show this paragraph?
    <p>Roses are red<br>Stars shine<br>Rivers flow<br>Sky is blue</p>
  32. 32.🔗 What does target="_blank" do to a link? (a) opens it in a new tab (b) makes it blank (c) makes it bold (d) hides the link
  33. 33.🔗 Which address opens when you click this link?
    <a href="art.html">Visit the site</a>     (a) quiz.html (b) art.html (c) Visit the site (d) news.html
  34. 34.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 16px;
    }
    @media (max-width: 480px) {
      p {
        font-size: 10px;
      }
    }
  35. 35.What does justify-content: flex-end do? (a) packs boxes at the end (b) packs boxes at the start (c) equal gaps, none at ends (d) puts boxes in the middle
  36. 36.🔢 On a typical page, from top to bottom, which comes first: “<main>” or “<footer>”? (a) <main> (b) <footer>
  37. 37.📋 What number does the browser show next to “Jamun”?
    <ol start="8">
      <li>Guava</li>
      <li>Jamun</li>
      <li>Grapes</li>
      <li>Papaya</li>
    </ol>
  38. 38.True or false: h1 { font-size: 32px; } goes in style.css. (a) False (b) True
  39. 39.🖼️ Which tag puts a picture on a page? (a) <img> (b) <a> (c) <pic> (d) <p>
  40. 40.📛 In <a href="x.html">, what is href? (a) a closing tag (b) an attribute (c) a comment (d) an element name

Answer key

  1. True
  2. an empty tag
  3. Yes
  4. 15
  5. fort.jpg
  6. green
  7. close it, tell an adult
  8. 16
  9. False
  10. Our school bus
  11. border
  12. <main>
  13. No
  14. 2
  15. CSS
  16. False
  17. weak
  18. 4
  19. index.html
  20. False
  21. <br>
  22. <h1 id="main">
  23. console.log()
  24. let
  25. :
  26. font-family
  27. style.css
  28. 304
  29. color
  30. 37
  31. 4
  32. opens it in a new tab
  33. art.html
  34. 10
  35. packs boxes at the end
  36. <main>
  37. 9
  38. True
  39. <img>
  40. an attribute

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