wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

Prelim Exam HTML-CSS

Total questions: 88

Worksheet time: 2hrs 6mins

Name
Class
Date
1.

Which tag is used to create a hyperlink in HTML?

a)

<link>

b)

<a>

c)

<href>

d)

<url>

2.

What does CSS stand for?

a)

Computer Style Sheets

b)

Creative Style Sheets

c)

Cascading Style Sheets

d)

Colorful Style Sheets

3.

Which HTML tag is used to define an unordered list?

a)

<ul>

b)

<ol>

c)

<li>

d)

<list>

4.

What is the correct CSS syntax to change the text color of a paragraph to red?

a)

p {text-color: red;}

b)

p {color: red;}

c)

p {font-color: red;}

d)

p {text: red;}

5.

Which property is used to change the background color in CSS?

a)

color

b)

bgcolor

c)
  • background-color

d)

background

6.

What is the correct HTML for creating a hyperlink to another website?

a)
c)
7.

What is the correct CSS syntax to change the font size of a paragraph to 16px?

a)

p {font-size: 16px;}

b)

p {size: 16px;}

c)

p {text-size: 16px;}

d)

p {font: 16px;}

8.

Which HTML tag is used to create a table?

a)

<table>

b)

<tr>

c)

<td>

d)

<th>

9.

What does HTML stand for?

a)

Hyper Text Markup Language

b)

Highly Technical Markup Language

c)

Home Tool Markup Language

d)

Hyperlink Text Markup Language

10.

What is the correct HTML for inserting an image?

a)

<img src="image.jpg" alt="MyImage">

b)

<image src="image.jpg" alt="MyImage">

c)

<img href="image.jpg" alt="MyImage">

d)

<image href="image.jpg" alt="MyImage">

11.

How do you add a background color for all <h1> elements?

a)

h1 {background-color: #FFFFFF;}

b)

h1.all {background-color: #FFFFFF;}

c)

all.h1 {background-color: #FFFFFF;}

d)

<all.h1 {background-color: #FFFFFF;}>

12.

Which HTML tag is used to define a table row?

a)

<tr>

b)

<table>

c)

<td>

d)

<th>

13.

What is the correct CSS syntax to center align text?

a)

p {text-align: center;}

b)

p {align: center;}

c)

p {center-align: true;}

d)

p {align-text: center;}

14.

Which HTML tag is used to create a line break?

a)

<br>

b)

<lb>

c)

<break>

d)

<line>

15.

What is the correct CSS syntax to make text bold?

a)

p {font-weight: bold;}

b)

p {bold: true;}

c)

p {text-bold: true;}

d)

p {weight: bold;}

16.

The < (a)   > tag is used to define a hyperlink in HTML.

17.

CSS stands for Cascading Style (a)   .

18.

The class attribute in HTML is used to apply styles from (a)   .

19.

The < (a)   > tag is used to define an image in HTML.

20.

The href attribute in the <a> tag specifies the (a)   of the linked document.

21.

The <!DOCTYPE> declaration in HTML is used to specify the (a)   type.

22.

The (a)   property in CSS is used to change the color of text.

23.

The < (a)   > tag is used to define a table in HTML.

24.

The _________ - _____ property in CSS is used to change the background color of an element.

(a)  

25.

What is the correct CSS syntax to change the background image of a div?

a)

div {background-image: url('image.jpg');}

b)

div {image: url('image.jpg');}

c)

div {bg-image: url('image.jpg');}

d)

div {background: url('image.jpg');}

26.

Which HTML tag is used to create a numbered list?

a)

<ol>

b)

<ul>

c)

<li>

d)

<nl>

27.

What is the correct CSS syntax to add a border around an element?

a)

element {border: 1px solid black;}

b)

element {add-border: 1px solid black;}

c)

element {border-style: solid;}

d)

element {outline: 1px solid black;}

28.

What is the correct HTML for creating a hyperlink to an email address?

a)

<a href="mailto:email@example.com">Email me</a>

b)

<a link="mailto:email@example.com">Email me</a>

c)

<a src="mailto:email@example.com">Email me</a>

d)

<a email="email@example.com">Email me</a>

29.

What is the correct way to comment out multiple lines in CSS?

a)

/* This is a comment */

b)

// This is a comment //

c)

<!-- This is a comment -->

d)

// This is a comment //

30.

This exam consists of answer questions related to HTML and CSS. Each question requires a brief written response. Please read each question carefully and provide your answer concisely.

Describe the difference between padding and margin in CSS.

4 lines
31.

What is the purpose of the alt attribute in the <img> tag?

4 lines
32.

This exam consists of answer questions related to HTML and CSS. Each question requires a brief written response. Please read each question carefully and provide your answer concisely.

What is the purpose of the alt attribute in the <img> tag?

4 lines
33.

This exam consists of answer questions related to HTML and CSS. Each question requires a brief written response. Please read each question carefully and provide your answer concisely.

How can you link an external CSS file to an HTML document?

4 lines
34.

What is the correct HTML for creating a checkbox?

a)

<input type="checkbox">

b)

<checkbox>

c)

<check>

d)

<input type="check">

35.

Which CSS property is used to change the text color of an element?

a)

color

b)

text-color

c)

font-color

d)

text-style

36.

What is the correct HTML for creating a radio button?

a)

<check>

b)

<input type="select">

c)

<radio>

d)

<input type="radio">

37.

Which HTML tag is used to create a footer section?

a)

<footer>

b)

<bottom>

c)

<section>

d)

<div>

38.

Which attribute specifies the URL where the form data should be sent?

a)

method

b)

action

c)

url

d)

target

39.

Which of the following is NOT a valid value for the type attribute?

a)

number

b)

email

c)

http

d)

text

40.

The placeholder attribute is used for:

a)

Making an input read-only

b)

Displaying a hint inside the input field

c)

Defining the visible width of the input field

d)

Setting the initial value of the input field

41.

Which element groups related form controls?

a)

label

b)

fieldset

c)

legend

d)

section

42.

What is the role of the for attribute in a label?

a)

To specify the form’s method type

b)

To identify the input element the label belongs to

c)

To define form submission behavior

d)

To group radio buttons

43.

Which element is used to add a title to a table?

a)

title

b)

caption

c)

thead

d)

tfoot

44.

Which HTML element is used for table headers?

a)

td

b)

tr

c)

th

d)

thead

45.

What is the purpose of the colspan attribute?

a)

To merge rows

b)

To merge columns

c)

To style columns

d)

To change cell width

46.

Which input type allows only one option from a group to be selected?

a)

checkbox

b)

radio

c)

select

d)

dropdown

47.

What is the “focused state” of an input field?

a)

When it is read-only

b)

When it is disabled

c)

When it is selected by the user

d)

When it is empty

48.

The HTML element used to group related form controls together is called (a)  

49.

The attribute that specifies the HTTP method used to send form data is (a)  

50.

The <td> element in a table represents a (a)   cell.

51.

The attribute that merges multiple table columns into one is called (a)  

52.

The <legend> element is used to provide a _______ or _____ for a fieldset.

(a)  

53.

To make a single option selectable among many, you use the (a)   input type.

54.

The placeholder text is displayed (a)   the user types in the input.

55.

The <thead> element contains (a)   rows of a table.

56.

The <caption> element must be the (a)   element inside a table.

57.

When an input is selected and ready for typing, it is in (a)   state.

58.

Which is the correct way to create a checkbox?

a)

<input checkbox="type">

b)

<input type="checkbox">

c)

<input type="check">

d)

<input check="box">

59.

Correct way to merge 3 columns in a table:

a)

<td merge="3">

b)

<td colspan="3">

c)

<td col="3">

d)

<td column="3">

60.

Proper <thead> structure:

a)

b)

c)

d)

None

61.

Correct HTML for a text input with placeholder:

a)

<input type="text" placeholder="Enter name">

b)

<input type="placeholder" text="Enter name">

c)

<input placeholder type="text">

d)

<input type="text" hint="Enter name">

62.

Valid HTML for a form with GET method:

a)

<form method="GET">

b)

<form type="GET">

c)

<form http="GET">

d)

<form get="true">

63.

Code for a button inside a form:

a)

<input type="button" value="Submit">

b)

<btn>Submit</btn>

c)

<button>Submit</button>

d)

Both a and c

64.

Correct way to connect a label with an input:

a)

b)

c)

Both a and b

d)

None

65.

Code for a table footer row:

a)

b)

c)

66.

Correct way to add table caption:

a)

<title> inside <table>

b)

<caption> as first element inside <table>

c)

<caption> after <tbody>

d)

<caption> anywhere in HTML

67.

HTML code for numeric input:

a)

<input type="numeric"

b)

<input type="number">

c)

<input number>

d)

<input num>

68.

Create a table header row with columns "Name", "Age", and "Email".

4 lines
69.

Write an input field for email with placeholder "Enter your email".

4 lines
70.

Make a checkbox labeled "Subscribe".

4 lines
71.

Create a radio button group for "Gender" with options "Male" and "Female"

4 lines
72.

Create a <tfoot> row showing "Total Books: 5" spanning 4 columns.

4 lines
73.

Build a <form> that sends data via POST to /submit.
NOTE: No input fields , Just form only.

4 lines
74.

Add a caption to a table that says "Student Grades".

4 lines
75.

Create a number input for "Quantity" with default value 1.

4 lines
76.

Link a label to an input field for "Username" using for and id.

4 lines
77.

Create a text input limited to 10 visible characters.

4 lines
78.

Which CSS property would you use to create space between the border of an element and its neighboring elements?

a)

padding

b)

border

c)

margin

d)

width

79.

What is the key characteristic that distinguishes inline-block elements from inline elements?

a)

Inline-block elements cannot be nested inside block elements

b)

Inline-block elements automatically span the full width of their container

c)

Inline-block elements allow setting of height and width, unlike inline elements

d)

Inline-block elements always break onto a new line

80.

What will happen if you set width: 600px; and max-width: 500px; on a div element?

a)

The element will be 600px wide

b)

The element will be 500px wide

c)

The element will be 550px wide

d)

The element will be 100px wide

81.

Which type of CSS is best suited for applying styles to a single webpage only?

a)

Inline CSS

b)

External CSS

c)

Internal CSS

d)

Universal CSS

82.

What is the default behavior of block-level elements in CSS?

a)

They take up as much width as necessary and stay within the flow of content

b)

They take up the full width of their container and start on a new line

c)

They are only used for images and links

d)

They are always aligned to the center of the page

83.

What does width=device-width in the meta viewport tag accomplish?

a)

Sets the width of all images to match the device width

b)

Tells the browser to match the page width to the device's screen width

c)

Adjusts the font size based on the device width

d)

Limits the maximum width of the webpage

84.

Which of the following correctly describes the anatomy of a CSS rule?

a)

property { selector: value; }

b)

selector { property: value; }

c)

value { selector: property; }

d)

selector: property { value }

85.

What is the primary purpose of CSS in web development?

a)

To structure the content of web pages

b)

To handle server-side logic

c)

To separate the presentation of a document from its content

d)

To manage database operations

86.

Cascading Order Trap: What color will this paragraph be?

4 lines
87.

External CSS Linking Question: Complete the HTML to properly link an external stylesheet named "main.css":

4 lines
88.

CSS Inheritance Question: Given this HTML structure and CSS, which p elements will be red?

4 lines