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.♿ A part of the page is under a <h4> heading. Which tag should its sub-heading use? (a) <h5> (b) <h6> (c) <h4> (d) <h1>
- 2.True or false: <meta charset="utf-8"> goes in the body. (a) True (b) False
- 3.Which of these has a closing tag? (a) <input> (b) <ul> (c) <img> (d) <hr>
- 4.✍️ CSS declarations go inside which brackets? (a) { } (b) < > (c) [ ] (d) ( )
- 5.🌗 Is white on dark blue easy or hard to read? (a) hard to read (b) easy to read
- 6.🔠 How many <h1> headings should a page usually have? (a) 1 (b) 10 (c) 3 (d) 6
- 7.Which of these is true of <nav>? (a) holds one blog post (b) helps you move around (c) holds copyright notes (d) holds extra side notes
- 8.Which of these is true of a web server? (a) has an address bar (b) saves our .html files (c) turns HTML into a page (d) stores a website’s files
-
9.📝 How many paragraphs does this code make?
<p>Our school trip</p>
<h2>Our school trip</h2>
<h2>Cricket is fun.</h2>
<p>Our school trip</p> - 10.📦 In the box model, which part is the line round the box? (a) border (b) padding (c) content (d) margin
-
11.✍️ How many declarations (property: value pairs) are in this rule?
body {
font-weight: bold;
} -
12.🔁 What does this code print?
let age = 42;
if (age < 33) {
console.log("teen");
} else {
console.log("child");
} (a) teen (b) child - 13.What does justify-content: space-between do? (a) packs boxes at the end (b) puts boxes in the middle (c) equal gaps, none at ends (d) packs boxes at the start
- 14.✍️ How does a CSS comment start? (a) // (b) <!-- (c) /* (d) #
- 15.📝 Which input type is for one line of words? (a) date (b) number (c) text (d) password
-
16.📱 The screen is 1366px wide. What font-size (px) does the paragraph get?
p {
font-size: 12px;
}
@media (min-width: 480px) {
p {
font-size: 18px;
}
} -
17.📊 How many cells does this table have in all?
<table>
<tr><td>Papaya</td><td>Orange</td><td>Orange</td><td>Grapes</td></tr>
<tr><td>Banana</td><td>Mango</td><td>Mango</td><td>Jamun</td></tr>
<tr><td>Guava</td><td>Jamun</td><td>Papaya</td><td>Jamun</td></tr>
<tr><td>Papaya</td><td>Grapes</td><td>Grapes</td><td>Guava</td></tr>
</table> - 18.True or false: to log out on shared PCs is not safe. (a) True (b) False
- 19.🔢 When you open a web page, which comes first: “the server sends files” or “you type the URL”? (a) you type the URL (b) the server sends files
- 20.⚡ What does alert() show? (a) a pop-up box (b) a new tab (c) a picture (d) a table
- 21.🧩 An opening tag + content + a closing tag together make an ___. (a) editor (b) element (c) attribute (d) address
- 22.True or false: <input type="radio"> is for an email address. (a) True (b) False
-
23.📦 How much space across (px) does this box take in all, margin included?
.box {
width: 220px;
padding: 15px;
border: 3px solid black;
margin: 15px;
} -
24.💪 How wide (px) is each gap between two boxes?
.row {
display: flex;
width: 380px;
justify-content: space-between;
}
Inside are 3 boxes, each 100px wide (no margins). -
25.💬 Which text will NOT show on the page?
<!-- <p>Hello, world!</p> -->
<p>My best friend</p>
<p>The red kite</p> (a) The red kite (b) Hello, world! (c) My best friend -
26.🖌️ What colour are the letters?
p {
background-color: blue;
text-align: left;
color: white;
font-size: 12px;
} (a) white (b) blue (c) green - 27.True or false: HTML reacts to a button click. (a) False (b) True
- 28.📦 In the box model, which part is the gap to other boxes? (a) padding (b) margin (c) border (d) content
-
29.📝 How many paragraphs does this code make?
<p>My pets</p>
<p>I love mangoes.</p>
<p>Rain today</p>
<h2>The red kite</h2>
<p>Good morning!</p>
<h2>Cricket is fun.</h2> - 30.Which of these does CSS do? (a) reacts to a button click (b) adds space around boxes (c) makes headings and lists (d) changes the page live
-
31.🔗 Which address opens when you click this link?
<a href="about.html">Take the quiz</a> (a) contact.html (b) about.html (c) Take the quiz (d) https://example.com -
32.🔒 Is the connection to this address scrambled (encrypted)?
http://www.example.com/games/chess.html (a) Yes (b) No - 33.True or false: <ul> goes in the head. (a) True (b) False
- 34.🔠 Which heading shows the SMALLEST text: <h3>, <h1>, <h5> or <h2>? (a) <h5> (b) <h1> (c) <h3> (d) <h2>
- 35.🌈 Which hex code is cyan? (a) #00ffff (b) #00ff00 (c) #000000 (d) #ffffff
-
36.📋 Does this list show bullets or numbers?
<ol>
<li>Papaya</li>
<li>Mango</li>
<li>Jamun</li>
</ol> (a) numbers (b) bullets -
37.📝 How many paragraphs does this code make?
<p>Hello, world!</p>
<p>Our school trip</p>
<h2>The red kite</h2>
<p>Hello, world!</p> -
38.🔍 One closing tag is missing. Which one?
<p>The red kite
<h2>Rain today</h2>
<i>Cricket is fun.</i> (a) </h2> (b) </p> (c) </strong> (d) </i> - 39.Which colour pair is easy to read? (a) red on green (b) light grey on white (c) dark grey on white (d) pink on red
- 40.🎯 Which element does the selector li style? (a) <li class="box"> (b) <div> (c) <span class="box"> (d) <p id="end">
Answer key
- <h5>
- False
- <ul>
- { }
- easy to read
- 1
- helps you move around
- stores a website’s files
- 2
- border
- 1
- child
- equal gaps, none at ends
- /*
- text
- 18
- 16
- False
- you type the URL
- a pop-up box
- element
- False
- 286
- 40
- Hello, world!
- white
- False
- margin
- 4
- adds space around boxes
- about.html
- No
- False
- <h5>
- #00ffff
- numbers
- 3
- </p>
- dark grey on white
- <li class="box">
Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids