Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 790 · 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 property is set to 20px in this rule?
   h1 {
     padding: 8px;
     font-size: 20px;
   } (a) 20px (b) background-color (c) text-align (d) font-size
2. 2.🚀 Which file should this code go in: #top { color: blue; } (a) index.html (b) style.css (c) script.js
3. 3.✍️ What is the selector in this CSS rule?
   li {
     font-size: 20px;
     padding: 8px;
   } (a) body (b) 8px (c) font-size (d) li
4. 4.🔍 Which is the odd one out? (a) shows a pop-up message (b) reacts to a button click (c) changes the page live (d) puts a picture on a page
5. 5.🔍 One closing tag is missing. Which one?
   <i>I love mangoes.</i>
   <small>Fun facts
   <p>Good morning!</p> (a) </h3> (b) </small> (c) </p> (d) </i>
6. 6.🔍 Which line is missing its closing tag?
   line 1: <p>Our school trip
   line 2: <h2>My pets</h2>
   line 3: <u>I love mangoes.</u> (a) line 3 (b) line 1 (c) line 2
7. 7.📄 What is the big heading shown on this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>My Hobbies</title>
   </head>
   <body>
     <h1>Match report</h1>
     <p>Thanks for visiting.</p>
   </body>
   </html> (a) My Hobbies (b) Match report (c) body (d) Thanks for visiting.
8. 8.True or false: <input type="email"> is for one line of words. (a) True (b) False
9. 9.True or false: <p>Hello!</p> goes in style.css. (a) True (b) False
10. 10.⚖️ What colour is the text of this element?
    <h1 class="menu" id="intro">Hi</h1>
    CSS:
    .menu { color: orange; }
    .menu { color: white; } (a) red (b) orange (c) black (d) white
11. 11.🔤 In “HTML”, what do the letters HT stand for? (a) HyperText (b) High Tech (c) Home Text (d) Hot Tags
12. 12.True or false: “label every form box” makes the page harder to use. (a) False (b) True
13. 13.⚡ What does alert() show? (a) a table (b) a picture (c) a new tab (d) a pop-up box
14. 14.Which colour pair is hard to read? (a) white on black (b) red on green (c) black on white (d) dark grey on white
15. 15.📝 How many paragraphs does this code make?
    <p>Cricket is fun.</p>
    <p>Good morning!</p>
    <h2>Our school trip</h2>
    <h2>Fun facts</h2>
    <p>My pets</p>
    <p>The red kite</p>
16. 16.🚀 Which file should this code go in: <ul><li>Art</li></ul> (a) index.html (b) script.js (c) style.css
17. 17.🔁 What does this code print?
    let marks = 42;
    if (marks < 5) {
      console.log("Pass");
    } else {
      console.log("Try again");
    } (a) Pass (b) Try again
18. 18.⚖️ What colour is the text of this element?
    <h2 class="big" id="hero">Hi</h2>
    CSS:
    #hero { color: purple; }
    #hero { color: white; } (a) orange (b) purple (c) yellow (d) white
19. 19.📱 The screen is 375px wide. What font-size (px) does the paragraph get?
    p {
      font-size: 12px;
    }
    @media (max-width: 1024px) {
      p {
        font-size: 6px;
      }
    }
20. 20.🔗 Which address opens when you click this link?
    <a href="quiz.html">Visit the site</a> (a) quiz.html (b) Visit the site (c) about.html (d) games.html
21. 21.💪 How much empty space (px) is before the first box?
    .row {
      display: flex;
      width: 540px;
      justify-content: center;
    }
    Inside are 4 boxes, each 100px wide (no margins).
22. 22.💪 How much empty space (px) is left after the last box?
    .row {
      display: flex;
      width: 280px;
      justify-content: flex-start;
    }
    Inside are 4 boxes, each 50px wide (no margins).
23. 23.💬 How many paragraphs show on the page?
    <p>Fun facts</p>
    <!-- <p>My pets</p> -->
    <p>Rain today</p>
24. 24.🔗 Which address opens when you click this link?
    <a href="art.html">Art corner</a> (a) art.html (b) news.html (c) quiz.html (d) Art corner
25. 25.✍️ Which property is set to italic in this rule?
    h2 {
      font-style: italic;
      margin: 10px;
    } (a) color (b) italic (c) font-size (d) font-style
26. 26.True or false: CSS counts down a timer. (a) True (b) False
27. 27.🔠 Which heading shows the SMALLEST text: <h2>, <h1>, <h6> or <h5>? (a) <h2> (b) <h6> (c) <h5> (d) <h1>
28. 28.🔗 Which words do you click on?
    <a href="quiz.html">Play games</a> (a) Play games (b) About us (c) quiz.html (d) href
29. 29.🌈 Which colour of light is strongest in rgb(106, 36, 203)? (a) green (b) red (c) blue
30. 30.📋 Which list tag lists things in any order? (a) <ol> (b) <li> (c) <ul>
31. 31.📝 On how many lines does the browser show this paragraph?
    <p>Birds sing<br>Roses are red<br>Sky is blue</p>
32. 32.📊 How many cells are in each row?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
      <tr><td>Grapes</td><td>Banana</td><td>Litchi</td><td>Orange</td></tr>
    </table>
33. 33.📝 How many paragraphs does this code make?
    <p>Good morning!</p>
    <h2>The red kite</h2>
    <h2>My pets</h2>
    <h2>The red kite</h2>
34. 34.True or false: margin is space inside the border. (a) True (b) False
35. 35.♿ Does this help everyone, or make the page harder to use: label every form box? (a) makes it harder (b) helps everyone
36. 36.🌍 What is the protocol in this URL?
    http://www.example.com/maths/tables.html (a) /maths/tables.html (b) https (c) www.example.com (d) http
37. 37.🏷️ Which is the closing tag for <i>? (a) <i> (b) <\i> (c) <i/> (d) </i>
38. 38.🌈 Which hex code is black? (a) #ffffff (b) #000000 (c) #ffff00 (d) #00ff00
39. 39.True or false: HTML makes headings and lists. (a) False (b) True
40. 40.🛡️ Is it safe to use the same password on every site? (a) Yes (b) No

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