Preview

11 - Practice Test

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

  paragraph

  list

  point

  image or word beginning with 'p'

 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)

  FALSE

  TRUE

 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 headings should always include a double H. e.g. /HH1

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

  Because it should be H1 without the angle brackets around it

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

 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>

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

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

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

  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

  They are referring to the width and height of the actual HTML 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>

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

  Button

  Click me

  HTML Buttons

 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>

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

  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'

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

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

  It writes the letters 'br' to the screen.

 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;">
htmlfoldersstructure.gif

  Option 4

  Option 2

  Option 3

  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>

  TRUE

  FALSE

 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'a' tag inside the 'img' tag

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

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

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

 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 clickable areas in the image-map

  the areas that have been deleted from the image

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

  the google maps location for any given image

 15. The following formatting element makes text:
<i>

  bold

  small text

  emphasised

  italic

 16. The following formatting element makes text:
<em>

  italic

  subscript

  emphasised

  small text

 17. The following formatting element makes text:
<sub>

  italic

  emphasised

  subscript

  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 4

  Option 2

  Option 3

  Option 1

 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>

  A local link is always much longer

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

  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

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

  Opens the linked document in a new window or tab

  Opens the linked document in the parent frame

  Opens the linked document in the full body of the window

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