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.📱 The screen is 820px wide. What font-size (px) does the paragraph get?
p {
font-size: 16px;
}
@media (min-width: 768px) {
p {
font-size: 20px;
}
} - 2.True or false: <header> holds a news story. (a) True (b) False
- 3.🌐 Which one stores a website’s files? (a) a code editor (b) a web server (c) a web browser
- 4.✍️ Which sign goes between a property and its value? (a) - (b) : (c) ; (d) =
-
5.🎯 Which CSS selector matches this element?
<h2 class="box" id="top">Hello</h2> (a) #box (b) #intro (c) .star (d) h2 - 6.🌍 What do we call the computer that stores a website? (a) a mouse (b) a server (c) a keyboard (d) a printer
- 7.🔢 In a basic web page file, which comes first: “</head>” or “<body>”? (a) <body> (b) </head>
- 8.🔗 Which attribute holds the address of a link? (a) src (b) id (c) alt (d) href
- 9.🌍 Which one stores the site’s files? (a) the URL (b) the browser (c) the server (d) HTTPS
- 10.🔠 Which heading shows the SMALLEST text: <h1>, <h3>, <h2> or <h6>? (a) <h1> (b) <h6> (c) <h3> (d) <h2>
-
11.📊 How many rows does this table have?
<table>
<tr><th>Name</th><th>Fruit</th></tr>
<tr><td>Guava</td><td>Guava</td></tr>
<tr><td>Litchi</td><td>Guava</td></tr>
</table> - 12.🌈 Which colour of light is strongest in rgb(125, 196, 107)? (a) red (b) green (c) blue
- 13.🌐 Which one has an address bar? (a) a web server (b) a web browser (c) a code editor
- 14.✍️ In color: blue; which part is the property? (a) blue (b) : (c) ; (d) color
-
15.🖌️ What colour are the letters?
h2 {
font-size: 32px;
text-align: center;
color: blue;
background-color: yellow;
} (a) purple (b) blue (c) yellow - 16.💪 Which justify-content value puts boxes in the middle? (a) space-between (b) flex-end (c) flex-start (d) center
- 17.Which of these is true of a web server? (a) shows pages from the web (b) saves our .html files (c) has an address bar (d) hosts websites online
-
18.🖼️ How many pixels wide is the picture drawn?
<img src="map.png" alt="Map of India" width="300"> - 19.True or false: to use a nickname in games is not safe. (a) False (b) True
- 20.📱 max-width: 600px applies when the screen is ___. (a) 600px or narrower (b) exactly 1000px (c) 600px or wider (d) turned off
-
21.📄 What does the browser tab show for this page?
<!DOCTYPE html>
<html>
<head>
<title>Art Gallery</title>
</head>
<body>
<h1>Planets</h1>
<p>I like to read.</p>
</body>
</html> (a) index.html (b) I like to read. (c) Art Gallery (d) Planets - 22.Which of these is true of a web server? (a) colours code to help us (b) turns HTML into a page (c) shows line numbers (d) sends pages over the net
- 23.📝 Which input type is for an email address? (a) radio (b) email (c) checkbox (d) date
- 24.🎯 What kind of selector is #end? (a) a class selector (b) an element selector (c) an id selector
- 25.🔁 Which word runs code only when something is true? (a) log (b) for (c) if (d) let
-
26.🔁 How many times does this code print “Welcome”?
for (let i = 0; i < 3; i++) {
console.log("Welcome");
} - 27.True or false: <input type="radio"> hides what you type. (a) True (b) False
- 28.🌗 Is pink on red easy or hard to read? (a) hard to read (b) easy to read
- 29.🌗 Is blue on purple easy or hard to read? (a) easy to read (b) hard to read
- 30.🔗 What does target="_blank" do to a link? (a) makes it blank (b) makes it bold (c) opens it in a new tab (d) hides the link
- 31.📄 Which part holds everything you see on the page? (a) the body (b) the doctype (c) the head (d) the title
- 32.🔠 Are headings shown in bold by default? (a) Yes (b) No
-
33.🖌️ Where does the text sit on its line?
h2 {
font-size: 32px;
background-color: blue;
color: white;
text-align: right;
} (a) on the left (b) in the middle (c) on the right - 34.What is <input type="number"> for? (a) lets you pick only one (b) takes only numbers (c) hides what you type (d) lets you tick many
- 35.True or false: in <img>, height names the picture file. (a) True (b) False
- 36.🔢 On a typical page, from top to bottom, what comes right after “<header>”? (a) <footer> (b) <nav> (c) <main>
- 37.Which of these is safe to do online? (a) type a password on http (b) post your home address (c) share your password (d) use a strong password
-
38.⚡ What number does this code print?
let a = 6;
let b = 3;
console.log(a * b); - 39.🖼️ Which attribute of <img> is read by screen readers? (a) width (b) height (c) alt (d) src
-
40.🔁 How many times does this code print “Welcome”?
for (let i = 3; i < 11; i++) {
console.log("Welcome");
}
Answer key
- 20
- False
- a web server
- :
- h2
- a server
- </head>
- href
- the server
- <h6>
- 3
- green
- a web browser
- color
- blue
- center
- hosts websites online
- 300
- False
- 600px or narrower
- Art Gallery
- sends pages over the net
- an id selector
- if
- 3
- False
- hard to read
- hard to read
- opens it in a new tab
- the body
- Yes
- on the right
- takes only numbers
- False
- <nav>
- use a strong password
- 18
- alt
- 8
Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids