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.True or false: CSS puts a picture on a page. (a) True (b) False
- 2.🚀 Which file is best for the colours and fonts? (a) photo.jpg (b) script.js (c) index.html (d) style.css
- 3.True or false: <td> holds the whole table. (a) False (b) True
-
4.⚖️ What colour is the text of this element?
<h1 class="box" id="logo">Hi</h1>
CSS:
#logo { color: purple; }
#logo { color: green; } (a) white (b) purple (c) green (d) yellow - 5.📱 Responsive design means a page ___. (a) never changes (b) is only for laptops (c) fits every screen (d) has no pictures
- 6.🧩 Which language rounds box corners? (a) HTML (b) CSS (c) JavaScript
- 7.🧭 Which semantic tag holds the menu of links? (a) <footer> (b) <nav> (c) <main> (d) <header>
- 8.True or false: CSS reacts to a button click. (a) True (b) False
-
9.🖌️ How big is the text, in px?
p {
font-size: 32px;
text-align: right;
background-color: green;
color: blue;
} - 10.🔍 Which is the odd one out? (a) is where we type code (b) saves our .html files (c) shows line numbers (d) has an address bar
- 11.⚡ Where does console.log() show its output? (a) on the title bar (b) in the console (c) on the printer (d) in the address bar
- 12.True or false: the server sends the page back. (a) False (b) True
-
13.🔗 Which words do you click on?
<a href="quiz.html">Contact us</a> (a) quiz.html (b) href (c) Visit the site (d) Contact us - 14.📝 What does <br> do? (a) makes text bold (b) makes a list (c) starts a new line (d) adds a picture
- 15.True or false: <li> lists things in any order. (a) True (b) False
-
16.💬 Which text will NOT show on the page?
<p>Good morning!</p>
<!-- <p>I love mangoes.</p> -->
<p>Rain today</p> (a) Good morning! (b) Rain today (c) I love mangoes. - 17.🔢 On a typical page, from top to bottom, which comes first: “<nav>” or “<main>”? (a) <main> (b) <nav>
- 18.True or false: to share your OTP is not safe. (a) False (b) True
- 19.True or false: <input type="password"> hides what you type. (a) False (b) True
- 20.📦 In the box model, which part is space inside the border? (a) border (b) content (c) margin (d) padding
- 21.Which of these is safe to do online? (a) use a strong password (b) share your password (c) put secrets in comments (d) post your home address
-
22.🌍 What is the path in this URL?
http://www.example.net/games/chess.html (a) www.example.net (b) /about.html (c) http (d) /games/chess.html - 23.🎯 What kind of selector is #top? (a) an element selector (b) an id selector (c) a class selector
-
24.🖌️ What colour is behind the letters?
p {
background-color: red;
text-align: left;
font-size: 36px;
color: black;
} (a) black (b) red (c) green - 25.📋 Which list suits a shopping list in any order? (a) <br> (b) <ol> (c) <ul> (d) <hr>
-
26.🌍 What is the domain name in this URL?
http://kids.example.org/news/today.html (a) /news/today.html (b) http (c) kids.example.org (d) school.example.in -
27.⚖️ What colour is the text of this element?
<h2 class="box" id="top">Hi</h2>
CSS:
.box { color: red; }
.box { color: orange; } (a) blue (b) orange (c) red (d) purple - 28.What is <input type="radio"> for? (a) is for an email address (b) takes only numbers (c) lets you pick only one (d) hides what you type
- 29.🌍 Which one asks for a web page? (a) HTTPS (b) the browser (c) the server (d) the URL
- 30.🌗 Is white on black easy or hard to read? (a) easy to read (b) hard to read
- 31.🌈 In #1b0000 the red part is the hex number 1b. What is it as a normal number?
-
32.💪 How much empty space (px) is left after the last box?
.row {
display: flex;
width: 270px;
justify-content: flex-start;
}
Inside are 4 boxes, each 60px wide (no margins). - 33.🎯 Which element does the selector #intro style? (a) <li id="main"> (b) <li class="intro"> (c) <li id="intro"> (d) <div class="note">
-
34.📦 How much space top to bottom (px) does this box take in all, margin included?
.box {
height: 110px;
padding: 5px;
border: 2px solid black;
margin: 20px;
} - 35.Which of these is a weak password? (a) S0lar!Pen#8 (b) Blue@Tiger_74 (c) abcd1234 (d) Rain#Drop_42!
- 36.📝 What does a password box show instead of letters? (a) capital letters (b) dots (c) emojis (d) numbers
- 37.🌈 What is the biggest number one colour can have in rgb()? (a) 100 (b) 255 (c) 99 (d) 1000
-
38.✍️ Which property is set to 2px solid in this rule?
h2 {
margin: 10px;
font-size: 20px;
border: 2px solid;
} (a) 2px solid (b) border (c) font-style (d) width -
39.📝 How many paragraphs does this code make?
<p>My best friend</p>
<p>My best friend</p>
<p>Hello, world!</p>
<p>I love mangoes.</p>
<h2>Fun facts</h2>
<p>Cricket is fun.</p> - 40.📄 Can HTML on its own pick a random number? (a) No (b) Yes
Answer key
- False
- style.css
- False
- green
- fits every screen
- CSS
- <nav>
- False
- 32
- has an address bar
- in the console
- True
- Contact us
- starts a new line
- False
- I love mangoes.
- <nav>
- True
- True
- padding
- use a strong password
- /games/chess.html
- an id selector
- red
- <ul>
- kids.example.org
- orange
- lets you pick only one
- the browser
- easy to read
- 27
- 30
- <li id="intro">
- 164
- abcd1234
- dots
- 255
- border
- 5
- No
Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids