Web Worksheet: Your First Website
Code tip (One file per job): Tags → index.html; selector { … } → style.css; let, alert, console.log → script.js. Plan → write the HTML → add CSS → test in a browser → publish. Use small letters and dashes in file names; save and refresh to see changes.
NameDateTime takenScore ___ / 40
- 1.🚀 Which file should this code go in: p { color: red; } (a) script.js (b) index.html (c) style.css
- 2.🔢 To build and share your first web page, which comes first: “publish it online” or “write the HTML”? (a) publish it online (b) write the HTML
- 3.🚀 Which file is best for code that reacts to clicks? (a) notes.txt (b) index.html (c) script.js (d) style.css
- 4.🔢 To build and share your first web page, which comes FIRST? (a) plan what to show (b) write the HTML (c) add CSS styles (d) test in a browser
- 5.True or false: <h1>My Site</h1> goes in index.html. (a) False (b) True
- 6.🚀 What is the home page file of a website usually called? (a) home.css (b) main.png (c) index.html (d) start.js
- 7.True or false: #top { color: blue; } goes in script.js. (a) False (b) True
- 8.🔢 To build and share your first web page, which comes first: “plan what to show” or “add CSS styles”? (a) plan what to show (b) add CSS styles
- 9.🚀 Which file should this code go in: <p>Hello!</p> (a) index.html (b) script.js (c) style.css
- 10.🚀 Which file is best for the colours and fonts? (a) script.js (b) style.css (c) index.html (d) photo.jpg
- 11.🚀 Which file should this code go in: alert(score); (a) style.css (b) script.js (c) index.html
- 12.True or false: #top { color: blue; } goes in index.html. (a) True (b) False
- 13.🔢 To build and share your first web page, which comes first: “publish it online” or “plan what to show”? (a) plan what to show (b) publish it online
- 14.🚀 You change your code. What should you do to see the change? (a) switch off the PC (b) delete the file (c) rename the folder (d) save and refresh
- 15.True or false: console.log(5 + 2); goes in style.css. (a) True (b) False
- 16.🚀 Which file should this code go in: <img src="cat.png"> (a) style.css (b) index.html (c) script.js
- 17.🚀 Which file should this code go in: h1 { font-size: 32px; } (a) style.css (b) index.html (c) script.js
- 18.🚀 Which file should this code go in: <ul><li>Art</li></ul> (a) script.js (b) index.html (c) style.css
- 19.🚀 Where in index.html does the link to style.css go? (a) in the head (b) in the footer (c) after </html> (d) inside a <p>
- 20.🔢 To build and share your first web page, what comes right after “plan what to show”? (a) add CSS styles (b) test in a browser (c) write the HTML (d) publish it online
- 21.🔢 To build and share your first web page, what comes right after “test in a browser”? (a) write the HTML (b) publish it online (c) add CSS styles (d) plan what to show
- 22.🚀 Which file should this code go in: let score = 0; (a) index.html (b) style.css (c) script.js
- 23.True or false: <img src="cat.png"> goes in index.html. (a) True (b) False
- 24.🔢 To build and share your first web page, what comes right after “add CSS styles”? (a) test in a browser (b) publish it online (c) plan what to show (d) write the HTML
- 25.🚀 Should file names have spaces, like my page.html? (a) Yes (b) No
- 26.🚀 Which file should this code go in: <h1>My Site</h1> (a) index.html (b) script.js (c) style.css
- 27.🚀 Which file should this code go in: alert("Hi"); (a) index.html (b) script.js (c) style.css
- 28.True or false: console.log(5 + 2); goes in script.js. (a) True (b) False
- 29.🚀 Which file should this code go in: <a href="a.html">Go</a> (a) style.css (b) script.js (c) index.html
- 30.True or false: body { margin: 0; } goes in style.css. (a) True (b) False
- 31.🔢 To build and share your first web page, what comes right after “write the HTML”? (a) test in a browser (b) plan what to show (c) add CSS styles (d) publish it online
- 32.🔢 To build and share your first web page, which comes first: “test in a browser” or “publish it online”? (a) test in a browser (b) publish it online
- 33.🚀 Which file should this code go in: body { margin: 0; } (a) style.css (b) script.js (c) index.html
- 34.True or false: <p>Hello!</p> goes in script.js. (a) False (b) True
- 35.🚀 Which file should this code go in: .box { padding: 8px; } (a) script.js (b) style.css (c) index.html
- 36.True or false: h1 { font-size: 32px; } goes in style.css. (a) True (b) False
- 37.True or false: console.log(5 + 2); goes in index.html. (a) False (b) True
- 38.True or false: score = score + 1; goes in script.js. (a) True (b) False
- 39.🚀 Which file should this code go in: console.log(5 + 2); (a) style.css (b) index.html (c) script.js
- 40.True or false: <ul><li>Art</li></ul> goes in script.js. (a) True (b) False
Answer key
- style.css
- write the HTML
- script.js
- plan what to show
- True
- index.html
- False
- plan what to show
- index.html
- style.css
- script.js
- False
- plan what to show
- save and refresh
- False
- index.html
- style.css
- index.html
- in the head
- write the HTML
- publish it online
- script.js
- True
- test in a browser
- No
- index.html
- script.js
- True
- index.html
- True
- add CSS styles
- test in a browser
- style.css
- False
- style.css
- True
- False
- True
- script.js
- False
Free html and css lessons, practice and worksheets at talentjr.in/html-css-for-kids