wayground logo

Free Printable Worksheets

NEW

Font size

S
M
L
XL
Worksheets

HTML, CSS, and Design

Total questions: 59

Worksheet time: 30mins

Name
Class
Date
1.

Which of the following is the proper way to apply the CSS code inside style.css to the home.html file?

a)

Inside home.html:


<head>

<link rel="stylesheet" type="text/css" href="style.css">

</head>

b)

Inside home.html:


<head>

<style href="style.css"></style>

</head>

c)

Inside style.css:


<html href="home.html">

d)

Inside style.css:


applyTo {

href: home.html;

}

2.

Which of the following is the proper way to link to the about.html page from the index.html page?

a)

<a href="about">About This Site</a>

b)

<a href="/about.html">About This Site</a>

c)

<a href="about.html">About This Site</a>

d)

<a href="/about">About This Site</a>

3.

What is the function of the div tag?

a)

To define a section of an HTML page

b)

To group a block of elements together to format them with CSS

c)

To efficiently apply the same style to several different elements

d)

All of the above

4.

Which of the following correctly uses div to style multiple elements the same way?

a)

<div class="intro">

<h2>Welcome</h2>

<p>Hi, welcome to my page.</p>

</div>

b)

<div>

<h2 class="intro">Welcome</h2>

<p class="intro">Hi, welcome to my page.</p>

</div>

c)

<div>

.intro{

font-size: 16px;

font-style: italic;

}

<h2>Welcome</h2>

<p>Hi, welcome to my page.</p>

</div>

d)

<h2 div class="intro">Welcome</h2>

<p div class="intro">Hi, welcome to my page.</p>

5.

Which of the following selects all p tags with the class alert and makes them red?

a)

p.alert {

color: red;

}

b)

p {

.alert {

color:red;

}

}

c)

.alert p{

color: red;

}

d)

p alert{

color: red;

}

6.

Which of the following will turn the h1 tag blue as the mouse hovers over it?

a)

hover > h1 {

color: blue;

}

b)

h1:hover {

color: blue;

}

c)

h1; hover {

color: blue;

}

d)

h1, hover {

color: blue;

}

7.
Karen wants to begin a new line within a paragraph of text on a webpage. Which code should she use?
a)
<li>
b)
<h1>
c)
<hr>
d)
<br>
8.
What is the proper code to insert an image named "frog.jpg"?
a)
<img src="frog" width="104" height="142">
b)
<img="frog.jpg" width="104" height="142">
c)
<img src="frog.jpg" width="104" height="142">
d)
<img ="frog" width="104" height"142">
9.
Annie wants the name of her product to be the main heading at the top of her webpage. Which tag defines
the main heading in a web document?
a)
<h3>Product</h3>
b)
<h5>Product</h5>
c)
<h1>Product</h1>
d)
<h6>Product</h6>
10.
A properly coded HTML tag will always be found between which two symbols?
a)
( )
b)
{ }
c)
[ ]
d)
< >
11.
When using a text editor, what file extension(s) must be used when saving as a web document?
a)
txt
b)
html or htm
c)
doc
d)
css
12.
Which line of code correctly places a gif image named "tiger" into a webpage?
a)
<img src="tiger" alt="BengalTiger" />
b)
<img gif=tiger alt="BengalTiger">
c)
<image source="tiger.gif" alt=BengalTiger" />
d)
<img src="tiger.gif" alt="BengalTiger" />
13.
Which line of code correctly creates a link to Amazon's website?
a)
<a ref=http://www.amazon.com>Amazon
b)
<href=http://www.amazon.com>Amazon<a>
c)
<a href="http://www.amazon.com">Amazon
d)
<a href="http://www.amazon.com">Amazon</a>
14.
Between which paired tags would the visible content of a webpage be displayed?
a)
<html></html>
b)
<head></head>
c)
<body></body>
d)
<title></title>
15.

HTML stands for

a)

Hyper Text Marker Language

b)

Hyper Text Marker Lingo

c)

Hyper Text Markup Language

d)

Hyper Text Markup Lingo

16.

CSS stands for

a)

Code Style Sheet

b)

Coding Style Sheet

c)

Cascading Sheet Style

d)

Cascading Style Sheet

17.

Which is the correct CSS syntax?

a)

body {color: yellow;}

b)

body:color=yellow;

c)

{body:color= yellow;}

d)

{body;color: yellow;}

18.
http://www.google.com is an example of a what?
a)
URL
b)
IP address
c)
Browser
d)
Application
19.
How do you tell the computer what the link's source is?
a)
href=""
b)
src=""
c)
link=""
d)
source=""
20.
How do you call a class in CSS?
a)
classname{}
b)
"classname"{}
c)
#classname{}
d)
.classname{}
21.
What tags do you use for html?
a)
<>
b)
{}
c)
()
d)
[]
22.
What do you use to set sizes?
a)
em
b)
%
c)
px
23.
How do you align text in the center?
a)
text-align: center;
b)
text-align: middle;
c)
text-align: left;
d)
text-align: right;
24.
How do you put in an image?
a)
<img = ""/>
b)
<img src=""></src>
c)
<image src = ""/>
d)
<img = ""></img>
25.

What are the basic tags to start a web page?

a)

<!DOCTYPE html>

<html>

<head> </head>

<title> </title>

<body> </body>

</html>

b)

<html>

<a> </a>

<p> </p>

<footer> </footer>

c)

<DOCTYPE>

<html>

<link> </link>

<ol> </ol>

<html>

d)

<!DOCTYPE html>

<body> </body>

<parapraph> </paragraph>

<title> </title>

<end> </end>

26.

What code is used for an ordered list?

a)

<ul> </ul>

b)

<ol> </ol>

c)

<list> </list>

d)

<p> </p>

27.

What code is used to make a bulleted list?

a)

<p> </p>

b)

<ol> </ol>

c)

<ul> </ul>

d)

<list> </list>

28.

what code is used to make a hyperlink?

a)

<hyperlink> </hyperlink>

b)

<link>

c)

<p> </p>

d)

<a> </a>

29.

What code is used to add an image?

a)

<add image>

b)

<img src="image.jpg">

c)

img {}

d)

<add Image>

30.

In order to link page one to page two: Which code is correct?

a)

<a href="page1.html" > Page 1</a>

b)

{a href="page1.html"} Page1{/a}

c)

<img src=Page1.jpg>

d)

<link rel"page1">

31.

Which is the correct code for a numbered list?

a)

<ul>

<li> item one</li>

<li> item two</li>

</ul>

b)

<ol>

<li> item one</li>

<li> item two</li>

</ol>

c)

<list>

<li> item one</li>

<li> item two</li>

</list>

d)

<p>

<li> item one</li>

<li> item two</li>

</p>

32.

Which of the following codes starts a set of HTML code?

a)

<html>

b)

<doctype html>

c)

<!DOCTYPE HTML>

d)

<doctype><html>

33.

Which of the following symbols indicates an ending tag in HTML?

a)

;

b)

/

c)

<>

d)

!

34.

When should you use the <ol> code to make a list?

a)

Steps for a recipe

b)

Top 10 items

c)

List of names

d)

None of the above

35.

When should you use the <ul> code to make a list?

a)

Top 5 Chef Favorites

b)

Ingredients list

c)

Steps to complete a recipe

d)

None of the above

36.

What is the difference between HTML and CSS?

a)

HTML provides the content, CSS provides the pictures

b)

HTML provides the structure & content, CSS provides the color / look of the web page

c)

HTML and CSS are the same thing

d)

None of the above

37.

How can you select all of the h3 tags on the webpage at one time to change the font color to blue?

a)

#allh1s { color: blue; }

b)

#h1 {blu}

c)

h1 {color: blue;}

d)

<h1 font-color="blue">

38.
Where in the HTML document is the correct location to insert code to link to your external CSS? 
a)
In the <head> section
b)
In the <body> section
c)
At the very end of the document
d)
At the very beginning of the document
39.
What symbols go around the properties for each CSS selector?
a)
< >
b)
[ ]
c)
{ }
d)
( )
40.
Which is the selector for a link?
a)
a { }
b)
link { }
c)
href { }
d)
a href { }
41.
The style that you are applying to a selector, e.g. border.
a)
Property
b)
Value
c)
Keyword
d)
Length Units
42.
What is this an example of?
/* This is a multi-line comment */
a)
Syntax
b)
Property 
c)
Value
d)
Comment
43.
Which heading tag is the largest in size?
a)
<h1>
b)
<h2>
c)
<h3>
d)
<h4>
44.
What is the function of the <p> tag?
a)
Defines a paragraph.
b)
Makes the text purple.
c)
It pushes the text to the right.
d)
Prints the webpage.
45.
You should save HTML files with which file extension?
a)
.htm
b)
.index
c)
.webpage
d)
.html
46.
Which tag is used to create a hyperlink?
a)
<a>
b)
<u>
c)
<b>
d)
<i>
47.
Which tag is used to add a picture to a web-page?
a)
<graphic>
b)
<img>
c)
<pic>
d)
<picture>
48.
Chrome, Safari, Firefox and Internet Explorer are all examples of?
a)
Browsers
b)
Interpreters
c)
Compilers
d)
Web Authoring Software
49.
A collection of web pages.
a)
server
b)
website
c)
www
d)
web links
50.
What does www stand for?
a)
width website web
b)
web world while
c)
web weld with
d)
world wide web
51.
Any content that is visible on your web page should go between these tags.
a)
<html></html>
b)
<style></style>
c)
<body></body>
52.

What is missing from this HTML skeleton?


<!DOCTYPE html>

<html>

<body>

</body>

</html>

a)

<head></head>

b)

<div></div>

c)

<img></img>

d)

<head>

53.

How do you change the font color with CSS?

a)

font-color: green;

b)

color: green;

c)

change-font-color: green;

d)

fontcolor=green;

54.

Where should you put the link tag to connect your CSS and HTML file?

a)

Between the <head> </head> in HTML

b)

Between the <body> </body> in HTML

c)

None of the above.

55.

Which of the following is the ONLY self closing tag?

a)

<img>

b)

<a>

c)

<h4>

d)

<body>

56.

What brackets do you use in CSS?

a)

<>

b)

{}

c)

()

d)

[]

57.
Which of the following is the largest heading? 
a)
h2
b)
h3
c)
h4
d)
h6
58.
Which tag provides information about a web site?
a)
<body>
b)
  <html>
c)
<meta>
d)
<title>
59.

What measurement do you use in CSS to decide on the size of fonts or content?

a)

Pixels

b)

Points

c)

Picas

d)

Inches