Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 691 · 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.🔗 Where does this link open?
   <a href="games.html" target="_blank">Maths fun</a> (a) in the same tab (b) in a new tab
2. 2.♿ What does good colour contrast mean? (a) many bright colours (b) only red text (c) no colours at all (d) text stands out clearly
3. 3.🖼️ How many pixels wide is the picture drawn?
   <img src="kite.png" alt="A red kite" width="350">
4. 4.🚀 What is the home page file of a website usually called? (a) start.js (b) home.css (c) main.png (d) index.html
5. 5.💬 How many paragraphs show on the page?
   <!-- <p>Cricket is fun.</p> -->
   <!-- <p>My best friend</p> -->
   <!-- <p>The red kite</p> -->
   <p>Our school trip</p>
   <!-- <p>I love mangoes.</p> -->
6. 6.🌍 What is the protocol in this URL?
   https://kids.example.org/index.html (a) http (b) /index.html (c) kids.example.org (d) https
7. 7.🔁 How many numbers does this code print?
   for (let i = 0; i < 18; i = i + 4) {
     console.log(i);
   }
8. 8.📊 Which tag holds the whole table? (a) <caption> (b) <table> (c) <th> (d) <td>
9. 9.📦 How much space across (px) does this box take in all, margin included?
   .box {
     width: 270px;
     padding: 25px;
     border: 1px solid black;
     margin: 0px;
   }
10. 10.🔗 Which address opens when you click this link?
    <a href="maths.html">Maths fun</a> (a) Maths fun (b) maths.html (c) art.html (d) news.html
11. 11.True or false: <tr> makes a heading cell. (a) True (b) False
12. 12.✍️ What is the selector in this CSS rule?
    li {
      background-color: yellow;
      font-weight: bold;
      text-align: center;
    } (a) bold (b) background-color (c) body (d) li
13. 13.📱 Responsive design means a page ___. (a) never changes (b) has no pictures (c) is only for laptops (d) fits every screen
14. 14.🌍 What does a web address (URL) tell the browser? (a) how old you are (b) where the page is (c) the page colour (d) your password
15. 15.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 110px;
      justify-content: flex-end;
    }
    Inside are 2 boxes, each 50px wide (no margins).
16. 16.True or false: <a href="a.html">Go</a> goes in index.html. (a) False (b) True
17. 17.🔠 Which heading shows the BIGGEST text: <h2>, <h5>, <h3> or <h1>? (a) <h1> (b) <h3> (c) <h5> (d) <h2>
18. 18.🖼️ How many pixels wide is the picture drawn?
    <img src="tiger.jpg" alt="A tiger asleep" width="300">
19. 19.🔁 What does i++ do? (a) prints i (b) doubles i (c) takes 1 from i (d) adds 1 to i
20. 20.⚖️ What colour is the text of this element?
    <p class="star" id="top">Hi</p>
    CSS:
    p { color: white; }
    #top { color: yellow; } (a) red (b) yellow (c) orange (d) white
21. 21.🧭 Why use <nav> instead of <div> for a menu? (a) it tells its meaning (b) it adds pictures (c) it loads faster (d) it makes text red
22. 22.What is <input type="text"> for? (a) is for one line of words (b) is for an email address (c) sends the form (d) picks a day
23. 23.♿ Does this help everyone, or make the page harder to use: use headings in order? (a) helps everyone (b) makes it harder
24. 24.🔗 Which code links to about.html? (a) <a src="about.html"> (b) <a alt="about.html"> (c) <link about.html> (d) <a href="about.html">
25. 25.🎨 Which tag holds CSS inside the head? (a) <body> (b) <style> (c) <script> (d) <css>
26. 26.True or false: <input type="email"> is for an email address. (a) True (b) False
27. 27.📊 In a table, which tag is a row? (a) <th> (b) <tb> (c) <tr> (d) <td>
28. 28.🌈 What is the biggest number one colour can have in rgb()? (a) 100 (b) 99 (c) 1000 (d) 255
29. 29.🌍 What is the path in this URL?
    http://kids.example.org/news/today.html (a) kids.example.org (b) /news/today.html (c) http (d) /games/chess.html
30. 30.📛 In <a href="x.html">, what is href? (a) an element name (b) a comment (c) an attribute (d) a closing tag
31. 31.🖼️ Which picture file does the browser load?
    <img src="moon.png" alt="The full moon" width="300"> (a) The full moon (b) bus.jpg (c) moon.png (d) fort.jpg
32. 32.📝 Does <meta> have a closing tag, or is it an empty tag? (a) has a closing tag (b) an empty tag
33. 33.📊 How many rows does this table have?
    <table>
      <tr><td>Grapes</td><td>Litchi</td></tr>
      <tr><td>Jamun</td><td>Guava</td></tr>
      <tr><td>Mango</td><td>Mango</td></tr>
    </table>
34. 34.🔍 Which line is missing its closing tag?
    line 1: <small>I love mangoes.
    line 2: <p>Cricket is fun.</p>
    line 3: <em>Good morning!</em> (a) line 3 (b) line 2 (c) line 1
35. 35.📝 On how many lines does the browser show this paragraph?
    <p>Birds sing<br>Stars shine</p>
36. 36.✍️ What value is given to background-color in this rule?
    .note {
      background-color: yellow;
      border: 2px solid;
      text-align: center;
      padding: 8px;
    } (a) 10px (b) yellow (c) background-color (d) 8px
37. 37.True or false: p is a class selector. (a) True (b) False
38. 38.📋 Does this list show bullets or numbers?
    <ol>
      <li>Grapes</li>
      <li>Mango</li>
    </ol> (a) numbers (b) bullets
39. 39.⚖️ What colour is the text of this element?
    <h2 class="menu" id="logo">Hi</h2>
    CSS:
    #logo { color: green; }
    #logo { color: white; } (a) purple (b) white (c) yellow (d) green
40. 40.📋 Does this list show bullets or numbers?
    <ol>
      <li>Banana</li>
      <li>Papaya</li>
    </ol> (a) bullets (b) numbers

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