Wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

HTML & CSS Practice Exam

Total questions: 57

Worksheet time: 57mins

Name
Class
Date
1.
What is the difference between an HTML Tag and an HTML element?
a)
An HTML Tag is case sensitive and an HTML element is not case sensitive.
b)
An HTML Tag is always paired and an HTML element is an "empty" tag.
c)
An HTML Tag defines content and an HTML Element includes the opening and closing tags and everything in between.
d)
An HTML Tag defines content and an HTML Element gives additional meaning and content.
2.
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>
3.
Jerry wants to insert a line break into his webpage. Which code should he use?
a)
<ul>
b)
<li>
c)
<br>
d)
<h1>
4.
Which item refers to the start tag, the end tag and everything in between?
a)
HTML Element
b)
HTML Tag
c)
HTML Attribute
d)
CSS
5.
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">
6.
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>
7.
Which tag defines the visible content of a web document?
a)
<head>
b)
<meta>
c)
<title>
d)
<body>
8.
What tag defines the beginning of a webpage?
a)
<html>
b)
<h1>
c)
<p>
d)
<body>
9.
A properly coded HTML tag will always be found between which two symbols?
a)
( )
b)
{ }
c)
[ ]
d)
< >
10.
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
11.
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" />
12.
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>
13.
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>
14.

HTML stands for

a)

Hyper Text Marker Language

b)

Hyper Text Marker Lingo

c)

Hyper Text Markup Language

d)

Hyper Text Markup Lingo

15.

CSS stands for

a)

Code Style Sheet

b)

Coding Style Sheet

c)

Cascading Sheet Style

d)

Cascading Style Sheet

16.

HTML tag keywords are surrounded by

a)

!--tag--!

b)

<tag>

c)

/tag/

d)

{tag}

17.

Which is the correct CSS syntax?

a)

body {color: yellow;}

b)

body:color=yellow;

c)

{body:color= yellow;}

d)

{body;color: yellow;}

18.

Which one is the correct syntax for CSS?

a)

property {selector : value}

b)

value {property : selector}

c)

selector {value : property}

d)

selector { property : value}

19.
Which of the following is NOT a function of the <title> </title> element?
a)
Defines a title in the browser tab.
b)
Provides a title for the page when added to favorites/bookmarks
c)
Creates the first heading on the index page of the website
d)
Displays a title for the page in search engine results
20.
http://www.google.com is an example of a what?
a)
URL
b)
IP address
c)
Browser
d)
Application
21.
What is the difference between an HTML Tag and an HTML element?
a)
An HTML Tag is case sensitive and an HTML element is not case sensitive.
b)
An HTML Tag is always paired and an HTML element is an "empty" tag.
c)
An HTML Tag defines content and an HTML Element includes the opening and closing tags and everything in between.
d)
An HTML Tag defines content and an HTML Element gives additional meaning and content.
22.
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>
23.
Jerry wants to insert a line break into his webpage. Which code should he use?
a)
<ul>
b)
<li>
c)
<br>
d)
<h1>
24.
John wants the name of his book to appear in search results for Google. Where should this information be
placed within his webpage?
a)
head
b)
meta
c)
body
d)
nav
25.
Which item refers to the start tag, the end tag and everything in between?
a)
HTML Element
b)
HTML Tag
c)
HTML Attribute
d)
CSS
26.
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">
27.
The World Wide Web Consortium (W3C) plays which role in the web development standards?
a)
It creates websites accessible to everyone.
b)
It develops the standards for HTML and CSS.
c)
It develops web browsers.
d)
It is the agency that controls the World Wide Web.
28.
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>
29.
Which tag defines the visible content of a web document?
a)
<head>
b)
<meta>
c)
<title>
d)
<body>
30.
Which tag will create a line break in a web document?
a)
<hr>
b)
<br>
c)
<h1>
d)
<body>
31.
What tag defines the beginning of a webpage?
a)
<html>
b)
<h1>
c)
<p>
d)
<body>
32.
A properly coded HTML tag will always be found between which two symbols?
a)
( )
b)
{ }
c)
[ ]
d)
< >
33.
Anthony is creating a webpage on seals. To ensure that his page can be found through Google, Anthony must include pertinent information in which tag section?
a)
head
b)
meta
c)
  body
d)
nav
34.
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
35.
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" />
36.
Which tag provides information about a web site?
a)
<body>
b)
  <html>
c)
<meta>
d)
<title>
37.
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>
38.
Which of the following is the proper way to code an inline style attribute?
a)
color=blue
b)
color="blue"
c)
color blue
d)
color=(blue)
39.
Which is the correct code to insert a horizontal line in a webpage?
a)
<hr>
b)
<br>
c)
<h1>
d)
<li>
40.
Which item interprets the source code in a web document?
a)
Text editor
b)
Web browser
c)
  HTML editor
d)
Web server
41.
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>
42.
Which hyperlink shows an absolute link?
a)
href="www.nytimes.com">NYTimes</a>
b)
<a href="page1.html">Page One<a>
c)
<a href="http://www.target.com">Target<a>
43.

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

a)

<html>

b)

<doctype html>

c)

<!DOCTYPE HTML>

d)

<doctype><html>

44.

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

a)

;

b)

/

c)

<>

d)

!

45.

How do you set up the body for your html web page?

a)

<b>

b)

<bo>

c)

<body>

d)

<doc>

46.

Which of the following BEST explains the difference between a <p> tag and a <br> tag?

a)

The <br> tag produces a blank line, while the <p> tag does not

b)

The <p> tag produces a blank line, while the <br> tag does not

47.

Which of the following lists includes EVERY type of code needed to make an unordered list?

a)

<ab> ... <li> .... </li> ... </ab>

b)

<unL> ... <li> .... </li> ... </unL>

c)

<ol> ... <li> .... </li> ... </ol>

d)

<ul> ... <li> .... </li> ... </ul>

48.

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

49.

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

50.

How do you make an image code?

a)

<img src="..." alt="...">

b)

<image source="..."> <alt>

</image> </alt>

c)

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

d)

None of the above

51.

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

52.

What is the proper way to reference an ID in the CSS?

(Note: Assuming that the ID is set up properly in the HTML)

a)

You would use a period: .idname

b)

You would use a number sign: #idname

53.

What is the proper way to reference a class in the CSS?

(Note: Assuming that the class is set up properly in the HTML)

a)

You would use a period: .classname

b)

You would use a number sign: #classname

54.

What is the purpose of using ID tags in HTML and CSS?

a)

To identify a word or phrase and make it stand out

b)

To identify a section of the HTML and make changes to it in CSS easier

c)

To identify a section of the HTML for the code, but it has nothing to do with CSS because they don't communicate for ID tags

55.

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">

56.

How would you select this paragraph by its ID in CSS?


<p id="intro">Welcome to our Intro to Computer Science and Web Design class! We are so happy that you are here. Please visit www.canvas.wcr7.org to get connected to our classroom site. Once there, please find the Modules tab and CLICK ON the DAILY SCHEDULE.</p>

a)

.p-intro { ... }

b)

#p-intro { ... }

c)

.intro { ... }

d)

#intro { ... }

57.

Which of the following would select only the images on the page with the class name of "icon" ?


<img class="icon" src="cat.gif">

<img class="icon" src="rabbit.gif">

<img src="balloon.gif">

<img src="truck.gif">

a)

#src { ... }

b)

.icon { ... }

c)

#icon { ... }

d)

.img-icon {... }