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 tag helps phones show a page at the right size? (a) the br tag (b) the title tag (c) the viewport meta tag (d) the hr tag
-
2.📋 What number does the browser show next to “Orange”?
<ol>
<li>Grapes</li>
<li>Orange</li>
<li>Litchi</li>
<li>Jamun</li>
</ol> - 3.💪 Which justify-content value puts boxes in the middle? (a) flex-end (b) space-between (c) center (d) flex-start
- 4.What is <input type="password"> for? (a) lets you pick only one (b) takes only numbers (c) sends the form (d) hides what you type
- 5.True or false: a web browser stores a website’s files. (a) False (b) True
- 6.🔠 Which heading shows the BIGGEST text: <h3>, <h5>, <h6> or <h1>? (a) <h5> (b) <h1> (c) <h6> (d) <h3>
-
7.⚖️ What colour is the text of this element?
<h2 class="star" id="end">Hi</h2>
CSS:
#end { color: purple; }
#end { color: orange; } (a) black (b) orange (c) purple (d) blue - 8.🌐 Which one turns HTML into a page? (a) a web browser (b) a web server (c) a code editor
- 9.True or false: <a href="a.html">Go</a> goes in script.js. (a) True (b) False
- 10.🔠 How many heading levels does HTML have? (a) 6 (b) 10 (c) 3 (d) 4
-
11.📱 The screen is 1100px wide. What font-size (px) does the paragraph get?
p {
font-size: 12px;
}
@media (max-width: 1024px) {
p {
font-size: 8px;
}
} - 12.🔒 What does the lock (HTTPS) in the address bar mean? (a) the site is free (b) the site is fast (c) the data is scrambled (d) the site is a game
- 13.🎯 Which sign starts an id selector? (a) # (b) . (c) & (d) @
- 14.🏷️ Which is the closing tag for <h3>? (a) <h3> (b) <\h3> (c) <h3/> (d) </h3>
- 15.True or false: in <img>, src sets how wide it is. (a) False (b) True
- 16.True or false: <hr> has a closing tag. (a) True (b) False
- 17.🔠 Which heading shows the SMALLEST text: <h5>, <h4>, <h1> or <h2>? (a) <h4> (b) <h2> (c) <h1> (d) <h5>
-
18.📦 How much space across (px) does this box take in all, margin included?
.box {
width: 90px;
padding: 20px;
border: 2px solid black;
margin: 15px;
} - 19.True or false: .big is an element selector. (a) False (b) True
- 20.🌈 In #009d00 the green part is the hex number 9d. What is it as a normal number?
-
21.🔗 Where does this link open?
<a href="news.html">Maths fun</a> (a) in the same tab (b) in a new tab -
22.📝 On how many lines does the browser show this paragraph?
<p>Kites fly high<br>Birds sing<br>Rivers flow</p> - 23.🌍 What finds the server for a domain name like example.com? (a) alt (b) DNS (c) HTML (d) CSS
- 24.What does color do? (a) sets the letter colour (b) colours behind the text (c) makes the text bold (d) centres a heading
-
25.🔗 Which address opens when you click this link?
<a href="games.html">Art corner</a> (a) contact.html (b) games.html (c) about.html (d) Art corner -
26.🖌️ What colour are the letters?
li {
color: white;
text-align: right;
background-color: blue;
font-size: 40px;
} (a) white (b) blue (c) red - 27.🌈 How many pairs of hex digits are in a colour like #ff8800? (a) 4 (b) 2 (c) 6 (d) 3
- 28.♿ Does this help everyone, or make the page harder to use: tiny grey text? (a) makes it harder (b) helps everyone
- 29.True or false: <th> makes a heading cell. (a) False (b) True
-
30.💬 Which text will NOT show on the page?
<p>Fun facts</p>
<p>Hello, world!</p>
<!-- <p>I love mangoes.</p> --> (a) Fun facts (b) I love mangoes. (c) Hello, world! - 31.💪 Which justify-content value equal gaps, none at ends? (a) flex-end (b) space-between (c) flex-start (d) center
- 32.🌐 Which one colours code to help us? (a) a web browser (b) a web server (c) a code editor
-
33.⚡ What number does this code print?
let runs = 23;
runs = runs + 16;
runs = runs - 22;
console.log(runs); -
34.🎯 Which CSS selector matches this element?
<div class="menu" id="hero">Hello</div> (a) #menu (b) .hero (c) .menu (d) .note -
35.🌍 What is the domain name in this URL?
https://learn.example.com/index.html (a) www.example.com (b) https (c) learn.example.com (d) /index.html - 36.🔢 In a basic web page file, which comes first: “<body>” or “<!DOCTYPE html>”? (a) <body> (b) <!DOCTYPE html>
- 37.📄 Where does <a> go: in the head or in the body? (a) in the body (b) in the head
-
38.📋 What number does the browser show next to “Jamun”?
<ol start="3">
<li>Papaya</li>
<li>Jamun</li>
<li>Mango</li>
<li>Litchi</li>
</ol> - 39.🎯 Which element does the selector li style? (a) <p id="top"> (b) <span class="box"> (c) <li class="box"> (d) <div>
-
40.🌍 What is the domain name in this URL?
https://learn.example.com/maths/tables.html (a) www.example.com (b) /maths/tables.html (c) learn.example.com (d) https
Answer key
- the viewport meta tag
- 2
- center
- hides what you type
- False
- <h1>
- orange
- a web browser
- False
- 6
- 12
- the data is scrambled
- #
- </h3>
- False
- False
- <h5>
- 164
- False
- 157
- in the same tab
- 3
- DNS
- sets the letter colour
- games.html
- white
- 3
- makes it harder
- True
- I love mangoes.
- space-between
- a code editor
- 17
- .menu
- learn.example.com
- <!DOCTYPE html>
- in the body
- 4
- <li class="box">
- learn.example.com
Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids