Preview

12 - Final Test

1. What is the following html code doing?

<html>
<body background="bgimage.jpg">
<h1>Hello world!</h1>
<p><a href="https://www.w3schools.com">Visit W3Schools.com!</a></p>
</body>
</html>

Setting an image as a heading (h1)

Setting the background to have the words 'bgimage.jpg' in it

Hyperlinking an image called 'bgimage.jpg' to another page

Setting an image 'bgimage.jpg' as the background of the page

2. What will the following html code produce?

<!DOCTYPE html>
<html>
<body>

<h2>Click me now</h2>
<button type="button" onclick="alert('Hello world!')">Click Me!</button>
 
</body>
</html>

It will display an empty button. The button can be clicked.

It will not display anything as it does not have the right opening html tags

A heading "Click me now" and a button with the text "Click Me!"

It will display a hyperlink "Click me now" and a grey button

3. One html coder has decided to use #000000 in his website. What is this likely to mean?

It is hexadecimal for the colour black

The hash code means that this is javascript and not html

It is a binary code for creating an html image

It is hexadecimal code for the colour green-yellow

4. What does the following html tag do?

<br>

Inserts the letters 'br' in between other letters.

Inserts a single space between letters

Inserts a single line break

Inserts a break rule (which is exiting the page) if the user presses 'Enter'

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

list

paragraph

image or word beginning with 'p'

point

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

TRUE

FALSE

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

8. 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 should be H1 without the angle brackets around it

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

9. 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>

It is an error - there is no such tag

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

image source

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

10. 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 size of the link:wwwtestandtrack.io

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

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

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

11. 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

Click me

Button

12. 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>

The first list is going to be displayed in alphabetical order

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

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

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

13. 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 draws a blank row line on the screen in the position it is coded

It writes the letters 'br' to the screen.

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

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

14. 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

15. 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 2

Option 3

Option 1

Option 4

16. The following formatting element makes text:

<i>

small text

italic

emphasised

bold

17. The following formatting element makes text:

<em>

subscript

italic

small text

emphasised

18. The following formatting element makes text:

<sub>

emphasised

subscript

italic

small text

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'

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

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

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 the same window/tab as it was clicked (this is default)

Opens the linked document in a new window or tab

Report an error