Web Development Worksheet: Final Test

HTML and CSS lesson 30: Web development final test · Set 787 · 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 of these is padding? (a) the gap to other boxes (b) the line round the box (c) the text or picture (d) the gap round content
2. 2.🌍 What is the protocol in this URL?
   https://www.example.com/news/today.html (a) /news/today.html (b) www.example.com (c) http (d) https
3. 3.📱 The screen is 414px wide. What font-size (px) does the paragraph get?
   p {
     font-size: 20px;
   }
   @media (max-width: 480px) {
     p {
       font-size: 14px;
     }
   }
4. 4.🖌️ How big is the text, in px?
   p {
     color: purple;
     font-size: 16px;
     text-align: left;
     background-color: white;
   }
5. 5.⚖️ What colour is the text of this element?
   <h1 class="red" id="end">Hi</h1>
   CSS:
   .red { color: green; }
   .red { color: black; } (a) orange (b) white (c) black (d) green
6. 6.🖼️ Which attribute of <img> shows if the image fails? (a) width (b) alt (c) height (d) src
7. 7.⚡ Which JavaScript word makes a new variable? (a) console.log() (b) for (c) alert() (d) let
8. 8.📄 What is the big heading shown on this page?
   <!DOCTYPE html>
   <html>
   <head>
     <title>My Hobbies</title>
   </head>
   <body>
     <h1>Welcome!</h1>
     <p>Mars is red.</p>
   </body>
   </html> (a) Welcome! (b) Mars is red. (c) body (d) My Hobbies
9. 9.📊 How many cells are in each row?
   <table>
     <tr><td>Guava</td><td>Papaya</td><td>Jamun</td></tr>
     <tr><td>Orange</td><td>Grapes</td><td>Litchi</td></tr>
     <tr><td>Orange</td><td>Mango</td><td>Litchi</td></tr>
     <tr><td>Mango</td><td>Litchi</td><td>Mango</td></tr>
   </table>
10. 10.🔠 Which heading shows the BIGGEST text: <h3>, <h6>, <h4> or <h5>? (a) <h4> (b) <h3> (c) <h6> (d) <h5>
11. 11.🌈 What is the biggest number one colour can have in rgb()? (a) 255 (b) 100 (c) 1000 (d) 99
12. 12.True or false: <aside> holds a side box of tips. (a) False (b) True
13. 13.📝 On how many lines does the browser show this paragraph?
    <p>Kites fly high<br>Rivers flow</p>
14. 14.🏷️ Which is the closing tag for <i>? (a) <\i> (b) </i> (c) <i/> (d) <i>
15. 15.🌐 Which one colours code to help us? (a) a code editor (b) a web server (c) a web browser
16. 16.📊 Which tag holds the whole table? (a) <table> (b) <tr> (c) <td> (d) <th>
17. 17.✍️ Which property is set to 8px in this rule?
    li {
      padding: 8px;
      border: 2px solid;
      color: red;
    } (a) border (b) font-weight (c) padding (d) 8px
18. 18.🖌️ How big is the text, in px?
    h1 {
      background-color: yellow;
      text-align: right;
      font-size: 12px;
      color: purple;
    }
19. 19.🔗 Which words do you click on?
    <a href="about.html">Maths fun</a> (a) Maths fun (b) Art corner (c) about.html (d) href
20. 20.🧭 Is <nav> semantic or not semantic? (a) not semantic (b) semantic
21. 21.📝 How many paragraphs does this code make?
    <p>Cricket is fun.</p>
    <h2>I love mangoes.</h2>
    <h2>My pets</h2>
22. 22.True or false: #top { color: blue; } goes in index.html. (a) False (b) True
23. 23.📄 What is the big heading shown on this page?
    <!DOCTYPE html>
    <html>
    <head>
      <title>Cricket Club</title>
    </head>
    <body>
      <h1>Match report</h1>
      <p>I like to read.</p>
    </body>
    </html> (a) I like to read. (b) Match report (c) body (d) Cricket Club
24. 24.✍️ In color: blue; which part is the value? (a) blue (b) ; (c) color (d) :
25. 25.🔍 One closing tag is missing. Which one?
    <b>My pets</b>
    <i>Good morning!
    <h2>My best friend</h2> (a) </b> (b) </u> (c) </h2> (d) </i>
26. 26.📊 How many cells does this table have in all?
    <table>
      <tr><th>Name</th><th>Fruit</th><th>Price</th></tr>
      <tr><td>Guava</td><td>Orange</td><td>Jamun</td></tr>
    </table>
27. 27.Which of these is an empty tag? (a) <hr> (b) <title> (c) <p> (d) <ul>
28. 28.📝 Does <li> have a closing tag, or is it an empty tag? (a) an empty tag (b) has a closing tag
29. 29.🔁 Which word runs code only when something is true? (a) log (b) if (c) let (d) for
30. 30.💪 Which justify-content value equal gaps, none at ends? (a) flex-end (b) flex-start (c) center (d) space-between
31. 31.📦 In the box model, which part is the gap round content? (a) margin (b) content (c) border (d) padding
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 sign goes between a property and its value? (a) = (b) - (c) : (d) ;
34. 34.Which of these is true of a code editor? (a) hosts websites online (b) opens web pages for us (c) is where we type code (d) answers page requests
35. 35.✍️ What is the selector in this CSS rule?
    body {
      font-size: 20px;
      font-style: italic;
      text-align: center;
    } (a) .box (b) font-size (c) body (d) italic
36. 36.🔠 How many <h1> headings should a page usually have? (a) 6 (b) 10 (c) 1 (d) 3
37. 37.♿ Does this help everyone, or make the page harder to use: write clear link text? (a) helps everyone (b) makes it harder
38. 38.Which of these does CSS do? (a) counts down a timer (b) changes the page live (c) sets colours and fonts (d) shows a pop-up message
39. 39.♿ A part of the page is under a <h3> heading. Which tag should its sub-heading use? (a) <h5> (b) <h4> (c) <h3> (d) <h2>
40. 40.✍️ Which property is set to 10px in this rule?
    p {
      width: 300px;
      margin: 10px;
    } (a) 10px (b) margin (c) padding (d) font-weight

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