Web Development Worksheet: Final Test
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.Which of these is an opening tag? (a) </h1> (b) </b> (c) </li> (d) <p>
- 2.📊 Which tag holds the whole table? (a) <th> (b) <table> (c) <caption> (d) <td>
- 3.True or false: the URL sends the page back. (a) False (b) True
-
4.⚖️ What colour is the text of this element?
<h2 class="red" id="top">Hi</h2>
CSS:
h2 { color: green; }
h2 { color: white; } (a) white (b) blue (c) green (d) yellow - 5.🔁 Which loop repeats code a set number of times? (a) let (b) else (c) for (d) if
- 6.📋 Which list tag lists things in any order? (a) <ol> (b) <ul> (c) <li>
-
7.🔠 How many headings are in this code?
<h1>Fun facts</h1>
<h4>My best friend</h4>
<h2>I love mangoes.</h2>
<h2>The red kite</h2> - 8.⚡ A JavaScript file usually ends with which extension? (a) .js (b) .css (c) .html (d) .jpg
- 9.📄 Which part holds everything you see on the page? (a) the doctype (b) the body (c) the title (d) the head
- 10.True or false: h1 { font-size: 32px; } goes in style.css. (a) False (b) True
- 11.Which of these is true of a code editor? (a) hosts websites online (b) stores a website’s files (c) shows pages from the web (d) colours code to help us
- 12.What is <input type="number"> for? (a) takes only numbers (b) lets you pick only one (c) picks a day (d) hides what you type
- 13.💪 Which flexbox property spaces boxes along a row? (a) justify-content (b) gap (c) flex-direction (d) display: flex
- 14.⚡ Which JavaScript word repeats code? (a) alert() (b) console.log() (c) let (d) for
-
15.📊 How many rows does this table have?
<table>
<tr><th>Name</th><th>Fruit</th><th>Price</th><th>Day</th></tr>
<tr><td>Mango</td><td>Litchi</td><td>Guava</td><td>Orange</td></tr>
<tr><td>Jamun</td><td>Guava</td><td>Papaya</td><td>Orange</td></tr>
<tr><td>Papaya</td><td>Grapes</td><td>Banana</td><td>Papaya</td></tr>
</table> - 16.📋 Which list tag is an unordered list? (a) <ul> (b) <ol> (c) <li>
- 17.Which of these goes in the body? (a) <meta charset="utf-8"> (b) <link rel="stylesheet"> (c) <a> (d) <title>
-
18.🔍 Which line is missing its closing tag?
line 1: <h2>My pets
line 2: <em>My best friend</em>
line 3: <b>Fun facts</b> (a) line 2 (b) line 3 (c) line 1 - 19.📊 Which tag makes a heading cell? (a) <th> (b) <caption> (c) <tr> (d) <table>
- 20.True or false: in <img>, alt shows if the image fails. (a) True (b) False
-
21.🌍 What is the protocol in this URL?
https://learn.example.com/art/gallery.html (a) http (b) learn.example.com (c) https (d) /art/gallery.html - 22.Which of these is a strong password? (a) iloveyou (b) password (c) Mango#Kite29! (d) qwerty
-
23.💪 How much empty space (px) is before the first box?
.row {
display: flex;
width: 200px;
justify-content: center;
}
Inside are 2 boxes, each 50px wide (no margins). - 24.🔍 Which is the odd one out? (a) adds space around boxes (b) makes headings and lists (c) gives the page structure (d) puts a picture on a page
-
25.⚖️ What colour is the text of this element?
<h1 class="menu" id="hero">Hi</h1>
CSS:
h1 { color: white; }
.menu { color: black; }
#hero { color: green; } (a) white (b) purple (c) black (d) green - 26.True or false: margin is the gap to other boxes. (a) False (b) True
-
27.🔁 How many times does this code print “Hello”?
for (let i = 0; i < 4; i++) {
console.log("Hello");
} - 28.🎯 Which element does the selector #intro style? (a) <p id="main"> (b) <p class="intro"> (c) <h1 class="note"> (d) <p id="intro">
- 29.Which of these is an empty tag? (a) <b> (b) <h1> (c) <br> (d) <title>
- 30.True or false: <table> makes one table row. (a) True (b) False
-
31.📱 The screen is 320px wide. Does the rule inside @media apply?
p {
font-size: 16px;
}
@media (min-width: 480px) {
p {
font-size: 22px;
}
} (a) No (b) Yes - 32.Which of these is safe to do online? (a) put secrets in comments (b) post your home address (c) meet an online stranger (d) tell a trusted adult
- 33.True or false: padding is the text or picture. (a) True (b) False
-
34.✍️ What value is given to border in this rule?
p {
padding: 8px;
background-color: yellow;
color: red;
border: 2px solid;
} (a) italic (b) border (c) 300px (d) 2px solid - 35.True or false: <img> goes in the head. (a) False (b) True
-
36.💬 Which text will NOT show on the page?
<!-- <p>Rain today</p> -->
<p>Fun facts</p>
<p>I love mangoes.</p> (a) Rain today (b) Fun facts (c) I love mangoes. - 37.Which of these has a closing tag? (a) <li> (b) <br> (c) <img> (d) <hr>
- 38.True or false: <ol> shows bullet points. (a) False (b) True
- 39.⚡ What does alert() show? (a) a table (b) a new tab (c) a picture (d) a pop-up box
- 40.🔍 Which is the odd one out? (a) turns HTML into a page (b) has an address bar (c) opens web pages for us (d) saves our .html files
Answer key
- <p>
- <table>
- False
- white
- for
- <ul>
- 4
- .js
- the body
- True
- colours code to help us
- takes only numbers
- justify-content
- for
- 4
- <ul>
- <a>
- line 1
- <th>
- True
- https
- Mango#Kite29!
- 50
- adds space around boxes
- green
- True
- 4
- <p id="intro">
- <br>
- False
- No
- tell a trusted adult
- False
- 2px solid
- False
- Rain today
- <li>
- False
- a pop-up box
- saves our .html files
Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids