Preview

11 - Practice Test

1. The h1 element defines a large heading. The p element defines a _____________

image or word beginning with 'p'

point

list

paragraph

2. The head element contains meta information about the document.

FALSE

TRUE

3. What you put between the two title tags is what will come up as the very first large heading on the page (positioned on the right)

TRUE

FALSE

4. Why is the Heading "My First Heading" smaller than the the paragraph text instead of being larger?

<!DOCTYPE html>
<html>
<head>
<title>THIS IS MY PAGE TITLE</title>
</head>
<body>

</h1>My First Heading<h1>
<p>My first paragraph.</p>

</body>
</html>

Because it should be H1/(capitals followed by a hash) to start off the heading

Because it starts with an ending h1 tag instead of a starting tag without the backslash

Because headings should always include a double H. e.g. /HH1

Because it should be H1 without the angle brackets around it

5. In the following tag, what is 'img src' likely to stand for?

<!DOCTYPE html>
<html>
<body>

<h2>Welcome</h2>
<p>We hope you are enjoying learning HTML with testandtrack!</p>

<img src="testandtrack.jpg" alt="www.testandtrack.io" width="104" height="142">

</body>
</html>

imaging sorcery (a type of creation of pixelated images using text)

large source (e.g. hyperlinking a huge page)

It is an error - there is no such tag

image source

6. In the following code, what are the numbers 104 and 142 referring to?

<img src="testandtrack.jpg" alt="www.testandtrack.io" width="104" height="142">

They are referring to the dimensions (size) of the word 'alt' on the page.

They are referring to the size of the link:wwwtestandtrack.io

They are referring to the width and height of the actual HTML page

They are referring to the width and height of the image being displayed on the page

7. Analyse the following code. What will the button that is created on the page say inside it?

<!DOCTYPE html>
<html>
<body>

<h2>HTML Buttons</h2>
<p>HTML buttons are defined with the button tag:</p>

<button>Click me</button>

</body>
</html>

HTML Buttons

There is no button on the page as this has been done incorrectly

Button

Click me

8. What is the difference between list 1 and 2 in this example?

<!DOCTYPE html>
<html>
<body>

<h2>This is List 1</h2>

<ul>
  <li>Coffee</li>
  <li>Apple</li>
  <li>Sugar</li>
</ul>  

<h2>This is list 2</h2>

<ol>
  <li>Coffee</li>
  <li>Apple</li>
  <li>Sugar</li>
</ol> 

</body>
</html>

List 1 is un-ordered, and List 2 is ordered (has numbers before each item on the list)

The second list will not display at all as there is no such command as 'ol'

There is no difference - both lists will be identical in display

The first list is going to be displayed in alphabetical order

9. What does the br (in angle brackets) element do if added to some HTML code?

<!DOCTYPE html>
<html>
<body> 

<p>This is a paragraph.<br>This is also a paragraph<p>
</body>
</html>

It provides a line break. It will print the second paragraph on a new line

It displays a "black, round circle" (like a large full stop) on the screen

It writes the letters 'br' to the screen.

It draws a blank row line on the screen in the position it is coded

10. Headings are defined with the h1 to h6 tags. The h6 tag is the biggest (most important) heading.

<!DOCTYPE html>
<html>
<body>

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

</body>
</html>

FALSE

TRUE

11. In this example, if the main page is 'index', and the image "ttio.gif" was stored in the images folder, what would the path be?

Option 1: <img src="ttio.gif" alt="TTIO ICON" style="width:128px;height:128px;">

Option 2: <images folder="/images/ttio.gif" alt="TTIO ICON" style="width:128px;height:128px;">

Option 3: <img src="images older = ttio.gif" alt="TTIO ICON" style="width:128px;height:128px;">

Option 4: <img src="/images/ttio.gif" alt="TTIO ICON" style="width:128px;height:128px;">

Option 3

Option 2

Option 4

Option 1

12. HTML also allows animated GIFS (moving images)

<!DOCTYPE html>
<html>
<body>

<h2>Animated Images</h2>
<p>The GIF standard allows moving images.</p>

<img src="programming.gif" alt="Computer man" style="width:48px;height:48px;">

</body>
</html>

FALSE

TRUE

13. To create an image that was also a hyperlink, you would _______________________

<a href="default.asp">
  <img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;border:0;">
</a>

put the 'img' tag inside the 'a' tag

put the image itself in the page directly (by pasting it)

cut and paste the image into the notepad file you are working on

put the'a' tag inside the 'img' tag

14. The 'map' tag defines an image-map. An image-map is an image with clickable areas. In the example here from w3schools, the 'area' tags define ____________________

<!DOCTYPE html>
<html>
<body>

<h2>Image Maps</h2>
<p>Click on the computer, the phone, or the cup of coffee to go to a new page and read more about the topic:</p>

<img src="workplace.jpg" alt="Workplace" usemap="#workmap" width="400" height="379">

<map name="workmap">
  <area shape="rect" coords="34,44,270,350" alt="Computer" href="computer.htm">
  <area shape="rect" coords="290,172,333,250" alt="Phone" href="phone.htm">
  <area shape="circle" coords="337,300,44" alt="Cup of coffee" href="coffee.htm">
</map>

</body>
</html>

the google maps location for any given image

the map location (using GPS) of the person creating the image

the areas that have been deleted from the image

the clickable areas in the image-map

15. The following formatting element makes text:

<i>

italic

bold

small text

emphasised

16. The following formatting element makes text:

<em>

italic

subscript

small text

emphasised

17. The following formatting element makes text:

<sub>

italic

subscript

emphasised

small text

18. Which of the following options is the correct way to turn the text 'Click me' bold?

Option #1
=========

Click me <b>

Option #2
==========

<b>Click Me</b>

Option #3
==========

<b>Click Me<b>

Option #4
===========
<bold Click me /b>

Option 1

Option 3

Option 2

Option 4

19. Have a look at the code below. What is the difference between the local link and the link to Google?

<!DOCTYPE html>
<html>
<body>

<h2>Local Links</h2>

<p><a href="myhtmlpage.html">HTML Images</a> is a link to a page on this website.</p>

<p><a href="https://www.google.com/">Google</a> is a link to a website on the World Wide Web.</p>

</body>
</html>

Local links always end in 'html' where as the other links always end in '.com'

A local link (link to the same web site) is specified with a relative URL (without http://www....).

A local link is always much longer

In this case the local link goes to Google. It means it is more secure

20. What does the following target attribute do (in the context of hyperlinks and HTML)

_blank

Opens the linked document in the full body of the window

Opens the linked document in the parent frame

Opens the linked document in a new window or tab

Opens the linked document in the same window/tab as it was clicked (this is default)

Report an error