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.⚖️ What colour is the text of this element?
<h1 class="red" id="logo">Hi</h1>
CSS:
#logo { color: yellow; }
.red { color: green; } (a) yellow (b) purple (c) green (d) red -
2.⚡ What number does this code print?
let marks = 5;
marks = marks + 4;
marks = marks - 7;
console.log(marks); - 3.What does justify-content: flex-start do? (a) packs boxes at the end (b) puts boxes in the middle (c) packs boxes at the start (d) equal gaps, none at ends
- 4.Which of these goes in the body? (a) <title> (b) <meta charset="utf-8"> (c) <a> (d) <link rel="stylesheet">
-
5.♿ Is this heading order correct (no level skipped)?
<h1> → <h1> → <h2> → <h4> (a) No (b) Yes -
6.🔁 What does this code print?
let score = 8;
if (score < 23) {
console.log("You win");
} else {
console.log("Play again");
} (a) Play again (b) You win - 7.✍️ In color: blue; which part is the value? (a) ; (b) blue (c) color (d) :
- 8.🔁 What does i++ do? (a) takes 1 from i (b) adds 1 to i (c) prints i (d) doubles i
-
9.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
p {
font-size: 16px;
}
@media (min-width: 480px) {
p {
font-size: 18px;
}
} - 10.🎯 Which element does the selector #end style? (a) <h2 class="box"> (b) <h1 id="hero"> (c) <h1 class="end"> (d) <h1 id="end">
-
11.🔍 One closing tag is missing. Which one?
<i>Our school trip</i>
<small>Good morning!</small>
<u>Rain today (a) </i> (b) </u> (c) </p> (d) </small> -
12.🖼️ The picture cannot load. Which text does the browser show instead?
<img src="tiger.jpg" alt="A tiger asleep" width="400"> (a) width (b) A red kite (c) tiger.jpg (d) A tiger asleep - 13.Which of these is not safe to do online? (a) use a nickname in games (b) check for https first (c) meet an online stranger (d) keep passwords secret
- 14.🛡️ Online: is it safe to use a strong password? (a) safe (b) not safe
-
15.🔗 Where does this link open?
<a href="news.html" target="_blank">School news</a> (a) in a new tab (b) in the same tab -
16.🌍 What is the protocol in this URL?
http://www.example.com/about.html (a) /about.html (b) https (c) www.example.com (d) http - 17.🔠 Which tag is the least important heading? (a) <h1> (b) <p> (c) <h3> (d) <h6>
- 18.🏷️ Which is the closing tag for <p>? (a) </p> (b) <\p> (c) <p> (d) <p/>
- 19.📦 In the box model, which part is the gap to other boxes? (a) content (b) border (c) margin (d) padding
-
20.📱 The screen is 1366px wide. What font-size (px) does the paragraph get?
p {
font-size: 20px;
}
@media (max-width: 768px) {
p {
font-size: 14px;
}
} - 21.Which of these is a strong password? (a) 123456 (b) iloveyou (c) Rain#Drop_42! (d) abcd1234
-
22.🌍 What is the path in this URL?
https://learn.example.com/about.html (a) /about.html (b) https (c) learn.example.com (d) /maths/tables.html - 23.True or false: in <img>, width shows if the image fails. (a) True (b) False
-
24.🌍 What is the path in this URL?
http://learn.example.com/maths/tables.html (a) http (b) /index.html (c) learn.example.com (d) /maths/tables.html - 25.🔐 Is password a strong or a weak password? (a) weak (b) strong
- 26.🧭 Is <div> semantic or not semantic? (a) not semantic (b) semantic
- 27.🔢 In a basic web page file, which comes LAST? (a) </html> (b) <!DOCTYPE html> (c) <head> (d) <body>
- 28.🖌️ Which CSS property sets the letter colour? (a) font-size (b) color (c) text-align (d) font-weight
- 29.🔠 Which tag is used for the main title on a page? (a) <h1> (b) <br> (c) <h6> (d) <p>
- 30.Which of these is true of <article>? (a) holds the logo and title (b) holds a news story (c) helps you move around (d) holds extra side notes
-
31.💬 Which text will NOT show on the page?
<p>Our school trip</p>
<p>I love mangoes.</p>
<!-- <p>The red kite</p> --> (a) I love mangoes. (b) Our school trip (c) The red kite - 32.🔠 How many heading levels does HTML have? (a) 4 (b) 3 (c) 6 (d) 10
- 33.♿ A part of the page is under a <h4> heading. Which tag should its sub-heading use? (a) <h5> (b) <h2> (c) <h6> (d) <h1>
-
34.📋 What number does the browser show next to “Orange”?
<ol start="8">
<li>Litchi</li>
<li>Jamun</li>
<li>Banana</li>
<li>Orange</li>
<li>Mango</li>
<li>Papaya</li>
</ol> - 35.🔢 On a typical page, from top to bottom, which comes FIRST? (a) <nav> (b) <footer> (c) <header> (d) <main>
- 36.📊 In a table, which tag is a row? (a) <th> (b) <tr> (c) <td> (d) <tb>
- 37.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <nav> (b) <main> (c) <footer>
- 38.🔍 Which is the odd one out? (a) has an address bar (b) opens web pages for us (c) is where we type code (d) shows pages from the web
- 39.True or false: <article> holds one blog post. (a) True (b) False
- 40.🎨 A CSS file usually ends with which extension? (a) .png (b) .html (c) .css (d) .js
Answer key
- yellow
- 2
- packs boxes at the start
- <a>
- No
- You win
- blue
- adds 1 to i
- 18
- <h1 id="end">
- </u>
- A tiger asleep
- meet an online stranger
- safe
- in a new tab
- http
- <h6>
- </p>
- margin
- 20
- Rain#Drop_42!
- /about.html
- False
- /maths/tables.html
- weak
- not semantic
- </html>
- color
- <h1>
- holds a news story
- The red kite
- 6
- <h5>
- 11
- <header>
- <tr>
- <nav>
- is where we type code
- True
- .css
Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids