Deck 7: Image Manipulations, Audio, and Video

Question 1

For the audio element, which property-value pair provides a suggestion to download the audio file when the page loads initially?

A) preload="default"
B) preload="auto"
C) preload="meta"
D) preload="none"

Answer 1

B

Question 2

A CSS image sprite is when you have a file with multiple images in it, and the browser animates the images so the user views only one image at a time.

Answer 2

True

Question 3

With the audio element, if you include the autoplay attribute, you should normally omit the controls attribute.

Answer 3

False

Question 4

Today's browsers include a built-in audio player that is used in conjunction with HTML5's ______ element.

Question 5

Explain what the following CSS rule does in terms of layout for a navigation bar's links:
nav > * {display: block;}

Question 6

The audio element's controls attribute can be implemented as an empty attribute. What is an empty attribute?

Question 7

Why might preloading an audio file be helpful?

Question 8

What is a benefit of not preloading an audio file?

Question 9

For a video element, it is always recommended that you include its width and height attributes. Why is it detrimental to omit the width and height attributes?

Question 10

The video element's controls attribute generates a control bar. Provide at least two functions that the control bar provides.

Question 11

Given the following img element, which of the subsequent CSS rules would position the image to the left, so text flows along its right edge?

< img class ="reposition" src= " ../images/peace.jpg" width="100" height="100" alt="" >

A) <code>.reposition {position: left;}</code>
B) <code>.reposition {position: right;}</code>
C) <code>.reposition {float: left;}</code>
D) <code>.reposition {float: right;}</code>

Question 12

In implementing a CSS image sprite file, the images come from:

A) the <code>img</code> element's <code>src</code> attribute.
B) a CSS rule with a <code>background-image-url</code> (filename) property-value pair.
C) separate web pages, using multiple <code>href</code> attributes.

Question 13

For the <code>audio</code> element, which property-value pair provides a suggestion to download the audio file's metadata when the page loads initially?

A) <code>preload="default"</code>
B) <code>preload="auto"</code>
C) <code>preload="meta"</code>
D) <code>preload="none"</code>

Question 14

For the <code>audio</code> element, which property-value pair provides a suggestion to download no information about the audio file when the page loads initially?

A) <code>preload="default"</code>
B) <code>preload="auto"</code>
C) <code>preload="meta"</code>
D) <code>preload="none"</code>

Question 15

In filling a browser viewport's background, what is it called when multiple copies of an image are displayed?

A) Cropping
B) Tiled layout
C) File expansion

Question 16

The <code>img</code> element is an inline element (more formally, a phrasing element), so it gets displayed within the normal flow of its surrounding text.

Question 17

A common way to create a CSS image sprite file is to find separate images, resize them so they have the same dimensions, and then use a tool to merge the images into one file.

Question 18

For audio files to work with HTML5, end users are required to install a browser audio plug-in.

Question 19

By including a <code>background-size: cover</code> property-value pair in a CSS rule, you are telling the browser to cover the web page's background by scaling the image.

Question 20

A(n) __________ icon (also known as a website icon, a bookmark icon, or a favicon) is an icon that appears in the tab area at the top of the window.

Question 21

To implement a video in a web page, you can use an iframe element and display a separate web page in it, or you can use a video element to run locally stored video files. What is an advantage of using an iframe element?

A) You can use JavaScript to customize your video.
B) You can avoid advertisements more easily.
C) You do not have to use up storage space on your own web server.

Question 22

Which of the following is valid code for a shortcut icon?

A) <img rel="icon" href="../images/jsd.g i f">
B) <img shortcut="icon" href="../images/jsd.g i f">
C) <link rel="icon" href="../images/jsd.g i f">

Question 23

To open an image in a browsing context, what attribute-value pair should you add to the img element?

A) Add a target attribute with a value equal to an iframe element's name attribute.
B) Add a frame attribute with a value equal to the iframe element's class attribute.
C) Add a target attribute with a value of _self.
D) Add a target attribute with a value of _blank.

Question 24

By including a background-position: center property-value pair in a CSS rule, it tells the browser to center the background image horizontally.

Question 25

Normally, web developers choose fonts that are considered to be "web fonts" because they are installed on users' computers by default.

Question 26

A color gradient value displays a smooth transition between two or more colors.

Question 27

To associate an img element with a map element, the img element must include a usemap attribute with the map element's id value for the usemap attribute's value.

Question 28

For shortcut icons, the W3C recommends using a JPEG file.

Question 29

If you move your mouse over an image map and click on a(n) __________, you jump to another web page or another place within the current web page.

Question 30

For a CSS dimension property (like height), you can use 100vh to indicate 100 percent of the viewport's height. The vh unit stands for __________.