HTML and CSS Final Study Guide version 3

Ace your homework & exams now with Quizwiz!

FALSE

Hue values range from 0˚ to 360˚, where 0˚ matches the location of blue on the color wheel, 120˚ matches red, and 240˚ matches green.

Identify a statement that is added to the first line of the file to run a script in strict mode.

"use strict";

American Standard code for information Interchange

(ASCII)

FALSE

A page name should be created to define styles for the first, left, and right pages.

What is the output of the following code? var sum = 0; var x = [1, 3, 7, 11]; x.forEach(sumArray); function sumArray(value) { sum += value;}

In the following code, identify the value of children.length property if article is the element node. <br /><article><br /> <h1>The U.S. Constitution</h1> <br /><h2>Preamble</h2><br /> <p>We the People of the United States, in Order to form a <br />more perfect Union ...<br /> </p><br /> </article>

Which of the following values will the expression 15 % 4 return?

Tangential

A side issue from the main web page content.

Pixel (px)

A single dot on the output device.

External Styles

A style created by the page author and placed into a CSS file and linked to the page.

User-Defined Styles

A style defined by the user based on settings made in configuring the browser.

Cascading Style Sheet (CSS)

A style sheet language supported by the W3C and used in web page design.

List Marker

A symbol displayed alongside a list item.

Which of the following is true of row groups that are defined in an HTML table?

A table can contain only one thead and tfoot element but can have numerous tbody elements.

One-sided element tag

A tag used for empty elements, containing no closing tag.

Progressive enhancement

A technique known as _____ places code conforming to older standards before newer properties, providing support for old browsers but still allowing newer standards and techniques to be used by the browsers that support them.

External Style Sheet

A text file that contains all of the styles you want to apply and is saved with the file extention .css; also called a linked style sheet.

Linked Style Sheet

A text file that contains all the styles you want to apply and is saved wit hthe file extention .css; also called an exernal style sheet.

Link

A text, image, or other web page element that you click to instruct the browser to go to a location in a file or to request a file from the server.

Serif

A typeface in which a small ornamentation appears at the tail end of each character.

Monospace

A typeface in which each character has the same width, often used to display programming code.

Cursive

A typeface that mimics handwriting with highly stylized elements and flourishes.

Sans-serif

A typeface without any serif ornamentation.

cursive

A typeface, best used in small doses for decorative page elements, that mimics handwriting with highly stylized elements and flourishes is _____.

Relative Units

A unit that is expressed relative to the size of other objects within the web page or relative to the display properties of the device itself.

XHTML (Extensible Hypertext Markup Language)

A version of HTML in which syntax standards are strictly enforced. HTML 5

Internet

A wide area network incorporating an almost uncountable number of networks and hosts across the world. HTML 4

pseudo-element

An object that exists only in the rendered page.

FALSE

Both the align-content and align-items properties have a default value of center

FALSE

Box shadows can only be placed outside an element.

TRUE

Browser extensions are identified through the use of a vendor prefix, which indicates the browser vendor that created and supports the property.

Style Rule

CSS code that sets the display properties of a page element.

!important

CSS keyword that forces a particular style to override the default style sheet cascade.

Border

CSS property that adds a border around all sides of an element.

CSS at-rule

CSS rule that directs how the browser should interpret and parse the CSS code.

Metadata

Content that describes the document or provides information about how the document should be processed by the browser.

Embedded content

Content that is imported from another resource, often nontextual.

Source Code

Code of instructions used to create a webpage or program.

Oscar's skateboards are manufactured in different hues. Which of the following features should Oscar add to allow customers to choose a shade of their choice?

Color pickers

_________ are the layouts in which content is displayed side-by-side in a page and differs from those layouts that use floating elements or flexboxes.

Column layouts

It acts like the basis value for items in a flexbox.

Column width

Unicode Transformation Format (UTF)

Compressed format that allows computers to display and manipulate text.

Unicode Transformation Format (UTF)

Compresses format that allows compuers to display and manipuilate text.

It is essentially the file format that is identified by a file extension.

Container

Presentational Attribute

An attribute that describes how page content should be rendered by the browser.

E-mail Harvester

An automated program that scans web pages for e-mail addresses

Rollover effect

An effect in which the page appearance changes as the user hovers the mouse pointer over a hypertext link.

Child Elements

An element contained within a parent element.

Nested Element

An element contained within another element.

Embedded Element

An element containing embedded content such as graphic images, audio soundtracks, video clips, or interactive games.

Inline Element

An element in which the content is placed in line with surrounding page content rather than starting on a new line.

Semantic element

An element in which the element name describes the purpose of the element and the type of content it contains.

Interactive element

An element that allows for interaction between the user and the embedded object. Also called embedded element.

Parent Element

An element that contains one or more child elements.

Descendant Elements

An element that descends from a parent element within the document hierarchy.

Presentational Element

An element that describes how page content should be rendered by the browser.

Empty element

An element that is either nontextual or contains directives to the browser about how the page should be treated.

Grouping element

An element that organizes similar content into a distinct group, much like a paragraph groups sentences that share a common theme.

Sectioning element

An element used to define major topical areas in the document.

Text-level element

An element within a grouping element that contains strings of characters or page content

White-spaced character

An empty or blank character such as a space, tab, or line break.

ISO 8859-1

An extended version of the ASCII character set.

Latin-1

An extended version of the ASCII character set.

Browser Extensions

An extension to CSS supported by a specific browser.

Script

An external program that is run within the browser.

Inline Image

An image that is placed, like text-level elements, in line with the surrounding content.

TRUE

Element attributes provide additional information to the browser about the purpose of the element or how the element should be handled by the browser.

Attribute minimization

Element attributes that do not require an attribute value. HTML 11

FALSE

Embedded styles apply to the Hypertext Markup Language (HTML) documents in which they are created and are accessible to other documents in the website.

For url type data, the virtual keyboard includes a key that inserts the .com character string.

False

Hue values range from 0˚ to 360˚, where 0˚ matches the location of blue on the color wheel, 120˚ matches red, and 240˚ matches green.

False

In the context of formatting lists, by default, unordered lists are displayed with numerals while ordered lists are displayed with a solid disc.

False

In the opacity property, if the value is 1, the object is completely transparent.

False

Order values for flexboxes cannot be negative.

False

Spanning cells are created by adding div attributes to either td or th element.

False

Stacking an element takes that element out of the normal flow of the document and positions it along the left or right edge of its containing element.

False

The advantage of lossless compression is that the same level of compression is achieved as with lossy compression.

False

The align-items property is only impactful when there are multiple lines of flex items.

False

The default style of browsers to format the print versions of the web pages they encounter always result in the best printouts.

False

The media feature orientation accepts min- and max- prefixes.

False

The open-space property defines how browsers should handle white space in a rendered document.

False

The perspective function should be used when only one object needs to be transformed in a 3D space.

False

The second option in a selection list is selected by default and therefore contains the field's default value.

False

The th element is used to mark the data cells.

False

The z-index property works only for elements that are placed with relative positioning.

False

There are predefined CSS styles to format the appearance of a placeholder.

False

To create a media query within a Hypertext Markup Language (HTML) file, the style attribute should be added to the link element in the document head.

False

To determine which option button has been checked by the user, you must examine the disabled property of each button.

False

Viewing a web page on a mobile device gives the same experience as viewing the same web page on a desktop computer.

False

When making tracks with Web Video Text Tracks (WebVTT), white spaces are ignored.

False

When setting the transition timing, it must be ensured that the speed of the transition is constant.

False

While designing web pages for mobiles, the page content should be extensive such that the readers get the opportunity to explore all facets of the topic.

False

With responsive design, it is easier to replace styles than to add new styles.

False

In the opacity property, if the value is 0, it means an object is completely opaque.

False

One can prevent browsers from displaying an element by setting its display property to inline.

False

One challenge of layout is that the document will be viewed on many different devices with the same screen resolution.

False

Relative positioning places an element at specific coordinates either in the page or within a container element.

False

Setting the display style to none hides an element but does not remove it from the page flow.

False

Spanning cells are created by adding div attributes to either td or th element.

False

The size of a background image is smaller than the size stored in the image file.

False

Transition is a technique of creating the illusion of movement by displaying a sequence of changing images in rapid succession.

False - Animation

For widows property widows: value; value is the minimum number of lines stranded before a column break.

False - after a column break

In the audio element <audio src="url" attributes />, the url specifies how the audio clip should be handled by the browser.

False - attributes

The growth value of flex items defines the initial size of an item before a browser attempts to fit it to the flexbox.

False - basis size

Command buttons are created using an input element with the type attribute set to range.

False - button

A flex item cannot itself be a flexbox for its child elements.

False - can

When a media player initially loads a video file, the player shows the last video frame as a preview of the video's content.

False - first

The post method is the default method that tells the browser to append the form data to the end of the URL specified in the action attribute.

False - get method

The th element is used to mark the data cells.

False - header cells

In the context of designing websites for mobile devices, to give a comfortable page layout user experience, the content should be laid out within a single column with no vertical scrolling.

False - horizontal

By default, flexbox items are arranged vertically.

False - horizontally

The original purpose of the web and HTML was to deliver textual information via separate hypertext documents.

False - interconnected

Widths in media queries are based on the width of the visual viewport.

False - layout

Using lossless compression, nonessential data are removed to achieve a smaller file size.

False - lossy compression

In the context of the application of the word-wrap property to a Uniform Resource Locator (URL) text, a value of break-word to the type attribute breaks a text string only at common break points.

False - normal

When controlling an animation, if a check box is selected the animation pauses.

False - plays

The most appropriate sizing unit for television devices is the use of points.

False - print, printing

Option buttons are also called selection lists as they select data values from a more extensive list of options.

False - radio buttons

When the hover event is used to hide an object or display it, mobile browsers employ a double-tap event in which the first tap activates any hypertext links associated with a page object.

False - second

A spinner control can be used to limit a numeric field to a range of possible values, thus allowing the user to drag a marker horizontally across the possible field values.

False - slider control

The language of the subtitle that is added to a media clip must be specified in the descriptions attribute in the track element.

False - srclang

Both the align-content and align-items properties have a default value of center.

False - stretch

HTML supports three row groups, which define rows that belong to the table head, table border, or table body.

False - table footer

The tty media type is used for television-type devices with low resolution, color, and limited scrollability.

False - tv

An important aspect of mobile design is optimizing a site's performance under static network conditions.

False - varying

While treating an entire definition list as a table, the div elements act as table rows and both the definition term <dt> and the descriptions <dd> act as table cells within that row.

TRUE

Which of the following table objects has the highest precedence in terms of style?

Table cells

It appears before the table body group.

Table footer row group

4 to 12

Tablet layouts are based on grids of _____ columns.

<meta>

Tag that has several functions but is used to declare the character encoding Utf-8.

<!DOCTYPE HTML>

Tag used to tell the browser which HTML or XHTML version and type the document uses.

Tags that contain the web page title and other document header information.

Tags that identify the definition of a term by offsetting the definition from the term.

Tags that indicate a term.

Tags that indicate the start and end of a definition list.

Tags that indicate the start and end of the body paragraph

Tags that indicate the title of a webpage, appears on the the browser title and task bar when the web page is displayed in the browser window.

Tags that must be at the start and end of an unordered or bulleted list.

Deprecated tags

Tags that the W3C has earmarked for eventual removal because they have been replaced by more functional tags.

Tags used at the start and end of an ordered or numbered list.

Tags used to define each list item within an unordered or ordered list.

The Cascading Style Sheets (CSS) grid styles introduced the _________ unit, which represents the fraction of available space left on the grid after all other rows or columns have attained their maximum allowable size.

Typography

The art of designing the appearance of characters and letters on a page.

margin space

The part of the box model that surrounds the element border, extending to the next element.

Identify a true statement about the perspective property.

The perspective property can be used when there are several transformed objects within a container that all need to appear within the same 3D space within a common perspective.

A smaller perspective value causes a pair of railroad tracks to converge over an apparently shorter distance, while a larger perspective value causes the tracks to appear to go farther before converging.

True

A table has one row with four cells and another row with five. After mapping the cells, the table will have five columns.

True

A user can manually zoom into a page to make it readable within the visual viewport, but it is done at the expense of hiding content.

True

A web table contains multiple table rows with each row consisting of one or more table cells.

True

A web table is an effective tool for organizing and classifying web page content.

True

An additional factor in applying a style sheet is that properties are passed from a parent element to its children in a process known as style inheritance.

True

An animation is limited to two style rules defined at the initial and end states.

True

An individual cannot use only the ul.submenu:hover selector because one cannot hover over the submenu until it is visible.

True

Backgrounds are added in the reverse order in which they're listed in a style rule.

True

Backgrounds are added in the reverse order in which they're listed in a style rule.

True

Client-side validation takes place on the user's browser.

True

Columns and column groups accept only CSS style properties to modify the column borders, background, width, and visibility.

True

Different items within a flexbox can have different growth rates.

True

Header cells and data cells are types of table cells supported by web tables.

True

If a flexbox doesn't wrap to a new line as it is resized, then the flex items will continue to shrink, still sharing the same row or column.

True

If a single value is specified in the background-position property, the browser applies that value to both the horizontal and vertical position.

True

In a form element, attributes specify how the form should be processed by the browser.

True

In addition to the W3C-supported style properties, most browsers supply their own extended library of style properties, known as browser extensions.

True

In column-span: span; property, span is either none to prevent spanning or all to enable the content to span across all of the columns.

True

Multiple shadows can be added to text by including each shadow definition in a comma-separated list.

True

Once columns are defined using the colgroup and col elements, individual columns can be identified using id and class attributes to apply CSS styles to specific columns.

True

Once the field values have been entered by the user, they are processed by a program running on the user's computer or on a web server in a secure location.

True

One advantage of user-defined style sheets is that they make the web more accessible to visually impaired users who may require larger fonts or the absence of clashing color schemes.

True

One of the key components while creating a mobile website design is to have the most important information up-front and easily accessible.

True

Only one caption is allowed per web table.

True

The @media and @import rules employ similar syntax.

True

The appearance of a command, submit, and reset button is determined by the browser.

True

The contents of an HTML file are arranged in a hierarchical structure, starting from the root html element itself and moving down to the text strings contained within individual page elements.

True

The default behavior of the selection list is to allow only one selection from the list of options.

True

The default browser style for data cells is to display text as unformatted text and left-aligned within the cell.

True

The device-aspect-ratio feature supported by Hypertext Markup Language (HTML) and Cascading Style Sheets (CSS) gives the ratio of the device-width value to the device-height value.

True

The evt.pageY property returns the vertical coordinate (in pixels) of the mouse pointer relative to the document.

True

The first style sheet interpreted by a browser is the one built into the browser itself

True

The id attribute is required only when it is needed to reference the control element.

True

The most common way of accepting user input is through a web form.

True

The placeholder automatically disappears as soon as a user selects the control and begins to enter a value.

True

The sizing keyword contain scales an image so that it is completely contained within an element, even if that means that not all of the element background is covered.

True

The src, type, height, and width attributes can be applied to the embed element for any plug-in.

True

The style rule border-spacing: 10px; specifies that all borders within a table should be separated by a distance of 10 pixels.

True

The style rule columns: 250px 4; creates a layout of 4 columns with a minimum width of 250 pixels each.

True

The style rules applied to an entire web table are the ones with the lowest precedence.

True

The styles applied to a page box using the @page rule are limited to defining the page size and the page margin.

True

The task of controlling video playback requires an external JavaScript program as there are no CSS styles to control the video playback.

True

There is no need to include a for attribute within a label element while nesting a control, if the association is made implicitly.

True

To create object classes, you should apply a function known as an object constructor that defines the properties and methods associated with the object type.

True

To format specific cues or text strings within a cue section, the cue text is identified using markup tags such as <span></span> for a span of text.

True

User-defined styles can be superseded by external styles, which are the styles that a website author creates and places within a Cascading Style Sheets (CSS) file and links to the page.

True

When a browser is unable to play an MP3 version or an OGG version of an audio file, a message is displayed as a fallback option asking the user to upgrade it.

True

When a document is sent to a printer, a browser determines the location of page breaks unless that information is included as part of the print style sheet.

True

When a span attribute is not included, the col element references a single column.

True

When a user hovers or touches a navicon, the navigation menu is revealed.

True

When applying an animation, the animation name must be listed first while the other properties can be listed in any order.

True

When for attribute is used, the label text can be placed anywhere within the page and it will still be associated with the control.

True

When no media attribute is used, a style sheet is assumed to apply to all devices accessing the web page.

True

When parameters of the radial-gradient function are omitted, they take their default values.

True

While designing web pages for mobile devices, the overall file size should be kept small.

True

While treating an entire definition list as a table, the div elements act as table rows and both the definition term <dt> and the descriptions <dd> act as table cells within that row.

True

Writing a style rule on a single line saves space, but entering each style property on a separate line often makes a code easier to read and edit.

True

Fixed layouts should only be used when one has more control over the devices that will display the page.

True

Header cells and data cells are types of table cells supported by web tables.

True

In column-span: span; property, span is either none to prevent spanning or all to enable the content to span across all of the columns.

True

Once columns are defined using the colgroup and col elements, individual columns can be identified using id and class attributes to apply CSS styles to specific columns.

True

Web page layouts fall into three general categories: fixed, fluid, and elastic.

True

When a span attribute is not included, the col element references a single column.

True

id and class

Two attributes, _____, are often key in targeting styles to specific elements.

Graphics Interchange Format (GIF)

Type of file that uses compression techniques called LZW compression to make it smaller for download on the web.

last

If two style rules have equal specificity, and thus equal importance, then the one that is defined _____ in the style sheet is the one used.

Public Domain

Images that are free and not subject to copyright.

Animated

Images that include motion and can change in appearance

end

In a two-sided tag, a(n) _____ tag indicates the content's end.

Identify a true statement about the figcaption element.

It is placed either directly before or directly after a figure box content.

_____ are text strings that appear within a form control, providing a hint about the kind of data that should be entered into the field.

Placeholders

_________ are text strings that appear within a form control, providing a hint about the kind of data that should be entered into the field.

Placeholders

It acts as a fallback option for browsers that do not support the HTML5 multimedia elements by adding the embed element.

Plug-in

It formats the printed version of a web document.

Print style sheet

_____ are like selection lists in which they limit fields to a set of possible values; but, unlike selection lists, the options appear as separate controls in the web form.

Radio buttons

kbd

_____, a Hypertext Markup Language (HTML) text-level element, marks text that represents user input, typically from a computer keyboard or a voice command.

Balance

_____, a principle of design, involves the distribution of elements.

Unicode

_____, the most extended character set, supports up to 65,536 symbols and can be used with any of the world's languages.

Perspective

_________ is a measure of how rapidly objects appear to recede from a viewer in a 3D space.

In the context of hypertext attribute, identify a target name that opens the page in the current window or tab.

_self

A plug-in either opens in its own external window or runs within a web page as a(n) _____. a. embedded object b. isolated object c. root object d. source object

Andy has created a table for product details where the names of the products and prices of the products are the headers of the table. Which of the following style rules should he add to place a border of 10-pixels around the table with a white background? a. table.product {background: white; border: 10px; width: 100%;} b. table.product {border: 10px, white; width: 100%;} c. table.product {background: white, 10px; width: 100%;} d. table.product {border: white; width: 100%;}

Codecs are placed within a _____ that handles the packaging, transportation, and presentation of data. a. container b. table c. windows d. cell

Consider the following text string consisting of four As followed by five Bs and six Cs. Identify a string that ensures no loss of information. a. 4A5B6C b. A3B4C5 c. ABC345 d. 456ABC

Data is compressed by removing redundant information using _____ compression. a. lossless b. lossy c. irreversible d. reversible

For each h1 heading to start on a new page, identify the style rule that should be used to insert a page break before each heading. a. h1 { page-break-before: always; } b. h1 { page-break-before: auto; } c. h1 { page-break-before: inherit; } d. h1 { page-break-before: content; }

For longer video clips, the time in the cue is written in the form _____. a. hh:mm:ss.ms b. hh.ms:ss c. hh.mm.ss d. ms:ss.mm:hh

Each hotspot within the map element is defined using the _____ element.

area

The _____ is a device feature that gives the ratio of the width of the display area to its height.

aspect-ratio

The _____ value of the overflow style keeps an element at a specified size, adding scroll bars only as they are needed.

auto

It starts the performance of a media clip as soon as it is loaded by the browser.

autoplay

A page break can be prevented from being added before or after a heading by using the keyword _____ in the page-break-before or page-break-after properties.

avoid

Andy wants the borders to be distinctly visible for each cell in the product details table. Which of the following properties must Andy add to his code to accomplish his goal? a. border-spacing: length; b. border-collapse: separate; c. border-collapse: collapse; d. border-spacing: initial;

Identify the correct format to set the size of a page margin to 0.5 inches. a. @page { *margin: 0.5in } b. @page { margin: 0.5in; } c. @page { <margin>: 0.5in; } d. @page { margin: (0.5in); }

Identify the cross-browser style sheet that changes the text color of the placeholder text for every input box to light red for the moz extension. a. input:-moz-input-placeholder {color: rgb (255, 151, 151);} b. input::-moz-placeholder {color: rgb(255, 151, 151);} c. input:-moz-placeholder {color: rgb (255, 151, 151);} d. input:: moz-placeholder-webkit {color: rgb(255, 151, 151);}

Identify the flex-direction property that is used to change the orientation of a flexbox. a. flex-direction: orient_direction; b. flex-direction: direction; c. @flex-direction: direction; d. flex-direction: *direction;

Identify the format for manually inserting a page break directly before an element. a. before(page-break): type; b. page-break-before: type; c. <page-break/>before: type; d. page-break: *before-type;

Identify the page rule using which styles are applied to a page box. a. #page { style rules } b. @page { style rules } c. *page { style rules } d. <page> { style rules }

Identify the page-break-inside property that prevents printers from inserting a page break. a. page-break-inside: always; b. page-break-inside: type; c. page-break-insert: avoid; d. page-break-insert: type;

Identify the selector that should be used to let a submenu remain visible even when the pointer moves away from the title and hovers over the non-visible submenu. a. a.submenuTitle:hover+ul.submenu, hover: ul.submenu b. a.submenuTitle:hover+ul.submenu, ul.submenu:hover c. a.submenuTitle:hover+ul.submenu, *ul.submenu:&hover d. a.submenuTitle:hover+ul.submenu, ul.submenu:@hover

The cue attribute _____ places a cue vertically within the video window, where value ranges from 0% (top) to 100% (bottom). a. position:value b. line:value c. vertical:type d. size:value

The styles for the _____ pseudo-element are limited to the background, color, font, opacity, outline, text-decoration, text-shadow, visibility, and white-space properties. a. kind b. cue c. embed d. iframe

The two types of table cells supported by web tables are _____. a. row cells and column cells b. header cells and data cells c. border cells and caption cells d. legend cells and web cells

The display type value _____ is displayed as a block unless its next sibling is also a block, in which case, it is displayed in-line, essentially combining the two blocks into one.

run-in

Identify a CSS3 2D transformation function that resizes an object by a factor of x horizontally.

scaleY(y)

Identify the default flex value that spontaneously sets the size of a flex item to match its content or the value of its width and height property. a. flex: 0 1 initial; b. flex: 0 1 none; c. flex: 0 1 inherit; d. flex: 0 1 auto;

Identify the kind attribute that is a default translation of a dialog from a media clip whose language is specified in the srclang attribute. a. descriptions b. chapters c. captions d. subtitles

If flex items are unable to fit within a single line, identify the flex-wrap property used to wrap those items to a new line. a. flex-wrap: type<flexbox>; b. flex-wrap: @type; c. @flex-wrap: type; d. flex-wrap: type;

Pete wants to set the playback quality parameter of the movie where the display quality of the video is favored over the playback speed. Which of the following values of the quality parameter must he apply to accomplish this? a. low b. true c. false d. high

To create a drop-cap, one can increase the font size of an element's _____ and float it on the left margin.

first letter

When a hover event is used to hide an object or display it, mobile browsers employ a double-tap event in which the _____ displays the page object.

first tap

It contains text values that are passed to the player to control the behavior and the content of a movie.

flashvar

Identify the default flex value that spontaneously sets the size of a flex item to match its content or the value of its width and height property.

flex: 0 1 auto;

A(n) _________ is a box containing items whose sizes can shrink or grow to match the boundaries of the box.

flexible box flexbox

According to Ethan Marcotte's responsive design theory, _____ is a primary component that ensures that the page layout of websites automatically adjusts to screens of different widths.

flexible layout

While creating a website for tablet design, to display the submenus horizontally rather than vertically, a style rule needs to be added to the tablet media query to _____.

float the submenus side-by-side

Identify a compare function that sorts numeric values in ascending order.

function ascending(a, b) {return a - b;}

Identify the structure in which any function, including named functions, is nested within another function.

function outsideFn() { commands function insideFn() { commands} commands}

Two attributes, _____, are often key in targeting styles to specific elements.

id and class

Identify the structure of an if statement.

if (condition) {commands}

inline image

incidcates the image or graphic file isnt part of the HTML.

Identify the repeat option in the border-image property that distributes extra space around the tiles when the slices don't fill the sides with an integer number of tiles.

space

Filter functions can be combined in a _____ to create new effects.

space-separated list

Data cells that do not function as headers for table rows or columns are marked using the _____ element.

Identify a pseudo-class for a check box or option button whose toggle states cannot be ascertained.

indeterminate

Jenny needs to change the existing layout where the flex items are laid down at the start of the main axis. Which of the following properties should Jenny use to specify a different placement for the flex items?

justify-content

This property has no impact when items are flexed to fill the entire given space.

justify-content

To associate a text string entered above each input element with a control, the text string should be enclosed within the _____ element.

label

If two style rules have equal specificity, and thus equal importance, then the one that is defined _____ in the style sheet is the one used.

last

Mobile devices have a _____ containing the entire content of the page, some of which may be hidden from a user.

layout viewport

Every field set must contain the _____ element, which should have only text and no nested elements for describing its content.

legend

Which of the following Hypertext Markup Language (HTML) grouping elements contains a single item from an ordered or unordered list?

The _________ attribute is added to the input element to apply a data list.

list, <input list="id"/>

Which of the following background-attachment properties is similar to scroll, but is used for elements, such as scroll boxes, to allow the element background to scroll along with the content within a box?

local

Multiple media features can be combined using _____.

logical operators

Items within a flexbox are laid out along a _____, which can point in either the horizontal or vertical direction.

main axis

Syntax for different settings for *multiple background images*?

make them througn comma https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_background-origin2

A page box is composed of the _________, which contains the space between the printed content and the edges of the page.

margin area

To apply a print style sheet, one must use the _________ attribute with the link elements to target style sheets to either screen devices or print devices.

media

get and post are two possible values for the _____ attribute.

method

The _________ attribute is always needed in an input element while submitting the form to a server.

name

For older browsers that do not support media queries, Cascading Style Sheets (CSS) 3 provides the _____ keyword to hide style sheets from those browsers.

only

Which of the following Cascading Style Sheets (CSS) 3 filters applies transparency to an image?

opacity

Identify the element that can organize selection list options by placing them in option groups in long selection lists.

optgroup

In the accompanying figure, Box B points to _____.

option buttons

To reduce the cluttered look of the web page, Jenny needs to separate the page content from page design. Which of the following properties must Jenny use to place the flex items in a desired order?

order: value;

Identify a general structure shared by all Uniform Resource Locators (URLs).

scheme:location

Identify a CSS3 2D transformation function that resizes an object by a factor of x horizontally.

scaleX(x)

JavaScript code is attached to an HTML file using the _____ element.

script

The _________ element is an HTML element used to access and run JavaScript programs that will run within the user's browser.

script

A(n) _____ is created using the select and option elements that present users with a group of predefined possible values for the data field.

selection list

By default, a _________ appears as a drop-down list box.

selection list

The given figure is an example of the _____ borders model.

separate

The process of validation that takes place on the web user is called _________.

server-side validation

Identify the syntax of the transform property.

transform: effect(params);

The _________ media type is used for fixed-width devices such as teletype machines and terminals.

tty

If no _____ value is specified, the browser assumes a default value of text and adds a simple text input box to the web form.

type

When embedding an audio element in a web page, the _________ attribute informs a browser of the file type and speeds up the process of choosing a compatible audio source.

type

Identify an attribute of the "a" element that indicates the media type of z linked document.

type="mime-type"

In flex-wrap: type;, the type should be _________ to wrap flex items to a new line starting in the opposite direction from the current line.

wrap-reverse

What's an important fact about shorthand properties in CSS?

you do not need to include all properties in a shorthand declaration of properties, but all properties you do include must be in the correct order

Identify an attribute selector that selects all elem elements whose att attribute begins with text.

elem[att^="text"]

Identify the format to add new content before an element with Cascading Style Sheets (CSS).

element::before {content: text;}

Unlike an external style sheet, a(n) _____ style sheet is applied only to the web page in which it is placed.

embedded

Which of the following is the default size keyword in the radial-gradient function?

farthest-corner

A _____ is one in which the size of the web page and the size of its elements are set regardless of the screen resolution.

fixed layout

Tim is creating a web page to display his poker club's set of rules. He has main categories and subcategories along with about a paragraph or more of explanation for each. Tim wants to display the subcategories in capital letters but does not want them to appear more important than the main categories, so he small capital letters. Which style should he use?

font-variant

local

To center an element vertically within its parent element, display the parent element as a table cell with a defined height and then set the vertical-align property to _____.

middle

Identify the default clear value that allows an element to be displayed alongside any floated objects.

none

A _____ is a classification of an element based on its current status, position, or use in a document.

pseudo-class

Case 5-1 Alex, a web designer, is assigned the task of creating a mobile-device-friendly website for a leading fashion outlet called AllStyles. A desktop version of AllStyles's website already exists. Alex can refer to this desktop version of the website to create the mobile website design. For the AllStyles's main web page, Alex creates a navigation bar that includes topical areas named Clothing, Accessories, and About Us. Alex wants to create nested lists within each of these topical areas that would contain links to specific pages on the AllStyles website. In order to do so, Alex must _____ while writing the HTML code.

put each of the nested lists within a class

The coordinates for the section element need not be defined as long as its position is set to _____.

relative

Identify the default type for the background-repeat style.

repeat

In the given image, which of the following types of background property does figure 2 denote?

repeat-x

If the slices of a graphic image do not fill the sides with an integer number of tiles, identify the repeat option that can be used with the border-image property to rescale the slices until they do.

round

TRUE

Users find it easier to scan content when page elements are aligned vertically and horizontally.

Identify a syntax that displays a selection list as a scroll box with 5 options visible in the web form. a. <select size="5"> ... </select> b. <option size="5"> ... </option> c. <select value="5"> ... </select> d. <option value="5"> ... </option>

Background-repeat: type;

Which of the following styles is used to specify the type of tiling to be applied to a background image, or even turn off tiling?

Ryan wants a particular embedded media clip to automatically restart when it has finished playing. Which of the following HTML audio and video element attributes must Ryan include in his code to accomplish this? a. src b. loop c. controls d. preload

external style sheet

also called a LINKED STYLE SHEET; a text file that contains all of the styles you want to apply; saved with .css

Nested List

A list that is placed inside another list.

Unordered list

A list that is used for items that do not follow a defined sequential order.

Ordered list

A list that is used for items that follow some defined sequential order.

HTML (Hypertext Markup Language)

A markup language that supports the tagging of distinct document elements and connecting documents through hypertext links. HTML 5

Leading

A measure of the amount of space between lines of text, set using the line-height property.

Tracking

A measure of the amount of space between words, set using the word-spacing property.

Opacity

A measure of the solidness of a color, ranging from 0 to 1.

browser styles

A style built into the web browser itself.

<aside>

A sectioning element that marks content related to the main article is _____.

Wildcard Selector

A selector that matches all elements.

Sibling Selectors

A selector that matches elements based on the elements that are adjacent to them in the document hierarchy.

Selector Patterns

A selector that matches only those elements that correspond to the specified pattern.

It is placed at the start of each row to identify the row content.

Header cell

Style Statement

Required code that defines the style on a style sheet.

Multi-tasking

When you have more than one program running at a time.

By default, CSS repeats background images _____

vertically and horizontally

FALSE

(T/F) A background image can be placed using the keywords left, center, and right for the vertical position and top, center, and bottom for the horizontal position.

TRUE

(T/F) Backgrounds are added in the reverse order in which they're listed in a style rule.

FALSE

(T/F) If a background extends through the border space by default, all coordinates for the image position are measured from the bottom-left corner.

TRUE

(T/F) If a single value is specified in the background-position property, the browser applies that value to both the horizontal and vertical position.

TRUE

(T/F) The background-position property is only useful for non-tiled images because a tiled image fills the background and it usually doesn't matter where the tiling starts.

TRUE

(T/F) The radii of individual corners are equal to the radii of hypothetical circles placed at the corners of a box with the arcs of the circles defining the rounded circles.

TRUE

(T/F) Tiling is when a browser loads a background image and then repeats the image in both the vertical and horizontal directions until the entire background is filled.

Which of the following examples tests whether x is equal to 5 or y is equal to 8?

(x === 5) || (y === 8)

Identify a contextual selector that matches any element.

*background-image:* keywords (5) and *link syntax*? More than one image?

1) background-image: url("img_tree.gif"), url("paper.gif"); To specify more than one image, separate the URLs with a comma 2) background-image: none - *This is default* 3) background-image: linear-gradient() 4) background-image: radial-gradient() 5) background-image: repeating-linear-gradient() | repeating-radial-gradient() https://www.w3schools.com/cssref/pr_background-image.asp

*background-repeat:* keywords (6) and what they do?

1) background-repeat: repeat - This is default 2) background-repeat: repeat-x 3) background-repeat: repeat-y 4) background-repeat: no-repeat 5) background-repeat: space The background-image is repeated as much as possible without clipping. The first and last images are pinned to either side of the element, and whitespace is distributed evenly between the images 6) background-repeat: round The background-image is repeated and squished or stretched to fill the space (no gaps) https://www.w3schools.com/cssref/playit.asp?filename=playcss_background-repeat&preval=space

A layout for a mobile device is typically based on a _____ grid.

1-column

When two adjacent 1-pixel-wide borders are collapsed together, the width of the resulting border is _____.

1-pixels

Hexadecimal

6 digit number code used to specify color.

Identify the output of the following code. var x = 8; var y = 6;

Identify a pseudo-class which is the first descendant of the parent that matches the specified type.

:first-of-type

T10 Case Problem 2: Harpe Gaming https://github.com/rebeccadeal/cis-1350/blob/master/html10/case2/scripts/hg_report.js

<!DOCTYPE html> <html lang="en"> <head>  <title>Dance Off VII</title> <meta charset="utf-8" /> <link href="hg_base.css" rel="stylesheet" /> <link href="hg_layout.css" rel="stylesheet" /> <script src="scripts/hg_product.js" type="text/javascript" defer="defer"></script> <script src="scripts/hg_report.js" type="text/javascript" defer="defer"></script> </head> <body> <header> <img src="hg_logo.png" alt="Harpe Gaming" /> <nav id="top"> <ul> <li><a href="#">Find a Store</a></li> <li><a href="#">Special Deals</a></li> <li><a href="#">My Account</a></li> </ul> </nav> <div><input type="text" placeholder="Find Games, Consoles, and More" name="gSearch" id="gSearch" /> <label for="gSearch"><img src="hg_search.png" alt="search" /></label> </div> <nav id="middle"> <ul> <li><a href="#">Xbox One</a></li> <li><a href="#">PS4</a></li> <li><a href="#">Xbox 360</a></li> <li><a href="#">PS3</a></li> <li><a href="#">PC</a></li> <li><a href="#">WiiU</a></li> <li><a href="#">3DS</a></li> <li><a href="#">VR</a></li> <li><a href="#">Others</a></li> </ul> </nav> </header> <section> <nav id="left"> <h1>Platforms</h1> <ul> <li><a href="#">Android</a></li> <li><a href="#">Card & Board Games</a></li> <li><a href="#">Game Boy</a></li> <li><a href="#">Nintendo</a></li> <li><a href="#">iPad®</a></li> <li><a href="#">iPhone®</a></li> <li><a href="#">iPod®</a></li> <li><a href="#">Linux</a></li> <li><a href="#">Macintosh</a></li> <li><a href="#">PC</a></li> <li><a href="#">PlayStation</a></li> <li><a href="#">Sega</a></li> <li><a href="#">Sony</a></li> <li><a href="#">Windows</a></li> <li><a href="#">Xbox</a></li> </ul> <h1>ESRB Ratings</h1> <ul> <li><a href="#">Early Childhood</a></li> <li><a href="#">Everyone</a></li> <li><a href="#">Everyone 10+</a></li> <li><a href="#">Teen</a></li> <li><a href="#">Mature</a></li> <li><a href="#">None</a></li> </ul> <h1>Condition</h1> <ul> <li><a href="#">New</a></li> <li><a href="#">Pre-Owned</a></li> <li><a href="#">Refurbished</a></li> <li><a href="#">Download</a></li> </ul> </nav> <article> </article> <aside> </aside> </section> <footer> <p>Harpe Gaming © 2018 All Rights Reserved</p> </footer> </body> </html> ------------------------------------------------------ "use strict"; /* New Perspectives on HTML5 and CSS3, 7th Edition Tutorial 10 Case Problem 2 Pages: 799-801 Due Date: 11/13/17 Author: Rebecca Deal Date: 11/7/17 Filename: hg_report.js Path: /rebecca.deal/html10/case2/scripts/hg_report.js */ /* Generate the game report */ var gameReport = '<h1>' + itemTitle + '</h1><h2>By: ' + itemManufacturer + '</h2>' + '<img src="images/hg_' + itemID + '.png" alt="' + itemID + 'gameImg" />' + '<table><tr><th>Product ID</th><td>' + itemID + '</td></tr>' + '<tr><th>List Price</th><td>' + itemPrice + '</td></tr>' + '<tr><th>Platform</th><td>' + itemPlatform + '</td></tr>' + '<tr><th>ESRB Rating</th><td>' + itemESRB + '</td></tr>' + '<tr><th>Condition</th><td>' + itemCondition + '</td></tr>' + '<tr><th>Release</th><td>' + itemRelease + '</td></tr></table>' + itemSummary; /* Write the game report to the article element */ document.getElementsByTagName('article')[0].innerHTML = gameReport; /* Calculate the average rating */ var ratingsSum = 0; var ratingsCount = ratings.length; // for loop to accumulate each rating to the ratings sum for (var i = 0; i < ratingsCount; i++) { ratingsSum += ratings[i]; } var ratingsAvg = ratingsSum / ratingsCount; /* Generate the rating report */ var ratingReport = '<h1>Customer Reviews</h1><h2>' + ratingsAvg + ' out of 5 stars (' + ratingsCount + ' reviews)</h2>'; // for loop to add the 3 most recent reviews to the rating report for (var i = 0; i < 3; i++) { ratingReport += '<div class="review"><h1>' + ratingTitles[i] + '</h1>' + '<table><tr><th>By</th><td>' + ratingAuthors[i] + '</td></tr>' + '<tr><th>Review Date</th><td>' + ratingDates[i] + '</td></tr>' + '<tr><th>Rating</th><td>'; // nested for loop to represent each review's rating with stars for (var j = 1; j <= ratings[i]; j++) { ratingReport += '<img src="images/hg_star.png" />'; } ratingReport += '</td></tr></table>' + ratingSummaries[i] + '</div>'; } /* Write the rating report to the aside element */ document.getElementsByTagName('aside')[0].innerHTML = ratingReport;

Which of the following HTML elements is used to create a table title?

The columns within the colgroup element are identified by the _____ element.

<colspan="value"/>

Which of the following provides the correct syntax for adding an event handler to a page element as an HTML attribute?

FALSE

A decimal is a number expressed in the base 16 numbering system rather than the commonly used base 10 system.

Write an HTML code to create a table with three rows and two columns. Add appropriate headers and enter the data into the table.

<table border="1"> <tr> <th>Name</th> <th>Roll No</th> </tr> <tr> <td>Andy</td> <td>34</td> </tr> <tr> <td>Anish</td> <td>35</td> </tr> </table>

Which of the following HTML tags is used to set the width of a table border?

Only one caption is allowed per web table, and the caption element must be listed directly after the opening _________ tag.

<table>

Identify the correct hierarchy of tags to create a web table.

Which of the following is an equivalent HTML element for display: table-cell; style?

<th>

Which of the following HTML elements is used to add a row in a table?

<tr>

Media devices can be specified when importing one style sheet into another by adding the media type to the _________ rule.

@import

To define a sequence of key frames in CSS, the _________ rule is applied.

@keyframes

Identify the media rule that must be included in a Cascading Style Sheet (CSS) file so that media queries can be used to associate specific style rules with specific devices.

@media devices {style rules}

Identify the media query that applies style rules only to screens that are at least 300 pixels wide.

@media screen and (min-width: 300px) {style rules}

Identify the correct format to set the size of a page margin to 0.5 inches.

@page {margin: 0.5in;}

Hexadecimal

A 6 digit number code used to specify a color for backgrounds, text, or links.

progressive enhancement

A CSS technique in which styles that conform to older standards are entered first with newer standards placed last.

Font Stack

A list of fonts defined in the font-family property.

pseudo-class

A _____ is a classification of an element based on its current status, position, or use in a document.

3D Transformation

A _________ is a change that involves three spatial axes: an x-axis that runs horizontally across the page, a y-axis that runs vertically, and a z-axis that comes straight out of the page toward and away from the viewer.

FALSE

A background image is attached to its element so that as the element content is scrolled through, the background image remains still.

Notepad++

A basic text editor that you can use for simple documents or for creating web pages using HTML.

Pseudo-class

A classification of an element based on its current status, position, or use in the document.

Character Set

A collection of characters and symbols.

RGB Triplet

A color value indicating the red, green, and blue values of a color.

Modules

A component of CSS3 that focuses on a particular design topic.

Virus

A computer program that can damage files and programs on your computer.

Client

A device that receives network information or services. HTML 4

Web Page

A document stored by a web server and accessed by a web browser. HTML 5

Bullet

A dot or other symbol positioned at the beginning of a list item.

Filter

A final way to alter an object is through a Cascading Style Sheets (CSS) _____.

FALSE

A flex item cannot itself be a flexbox for its child elements.

FALSE

A flexbox is a box containing items whose sizes are fixed.

Relative Path

A folder path expressed relative to the location of the current document.

Absolute Path

A folder path that starts from the root folder and processes down the entire folder structure.

Web Font

A font in which the font definition is supplied to the browser in an external file.

Web Safe Fonts

A font that is displayed mostly the same way in all operating systems and on all devices.

Specific Font

A font that is identified by name.

Identify the type of control that performs an action.

A form button

Description list

A list of terms and matching descriptions.

generic font

A general description of a font face.

FALSE

A generic font is a font that is identified by name, such as Times New Roman or Helvetica.

Joint Photographic Experts Group (JPEG)

A graphic image saved using a lossy compression technique that discards some data during the compression process and is best suited for images with smooth variation of tone and color.

Web Hypertext Application Technology Working Group (WHATWG)

A group formed in 2004 to develop HTML5 as a rival version to XHTML 2.0

World Wide Web Consortium

A group of web designers and programmers that set the standards or specifications for browser manufacturers to follow. HTML 5

Fantasy

A highly ornamental typeface used for page decoration.

Server

A host that provides information or a service to other devices on the network. HTML 4

Markup Language

A language that describes the content and structure of a document by tagging different document elements. HTML 5

Hanging indent

A layout in which the first line extends to the left of the block.

Box model

A layout model in which element content is surrounded by padding, border, and margin spaces.

Hyperlink

A link within a hypertext document that can be activated to access a data source. HTML 4

Hypertext

A method of organizing information in which data sources are interconnected through a series of hyperlinks that users activate to jump from one data source to another. HTML 4

hover

A mobile browser will interpret a _____ event as a tap event in which a user taps a page object.

Local Area Network

A network confined to a small geographic area, such as within a building or department. HTML 4

Client-Server network

A network in which clients access information provided by one or more servers. HTML 4

Node

A network location that can access and share information and services. HTML 4

Wide Area Network

A network that covers a wide area, such as several buildings or cities. HTML 4

TRUE

A network that covers a wider area, such as several buildings or cities, is called a wide area network or WAN.

Hexadecimal number

A number expressed in the base 16 numbering system.

Color Values

A numeric expression that defines a color.

page area

A page box is composed of a _____, which contains the content of a document.

Declaration

A part of the style statement that identifies how the element(s) should appear.

Selector

A part of the style statement that identifies the page elements.

Which of the following is true of the plug-in approach to deliver multimedia content?

A plug-in requires users to install a separate application in addition to their web browsers.

Print Out

A printed version of a file, web page, or other document; also called a hard copy.

Hard Copy

A printed version of a file, webpage, or other document; also called a printout.

Contextual Selector

A selector that specifies the context under which a particular page element is matched.

Validator

A program that tests code to ensure that it contains no syntax errors. HTML 7

Cascading Style Sheet (CSS)

A series of rules that defines the style for a webpage or entire web site.

List

A series of text items.

Web Server

A server that makes web pages accessible to the network. HTML 5

Protocol

A set of rules defining how information is passed between two network devices.

Style Sheet

A set of rules defining how page elements are displayed.

dynamic pseudo-class

A pseudo-class based on the actions of the user within the element.

structural pseudo-class

A pseudo-class based on the element's location within the structure of the HTML document.

FALSE

A radial gradient is a color gradient in which the background color transitions from a starting color to an ending color along a straight line.

Root em Unit

A relative unit of length that expresses a size relative to the font size of the root element.

viewport unit

A relative unit of length that expresses a size relative to the width or height of the browser window.

Modernizr

A script that provides support for HTML5 in older browsers

HTML5 Shiv

A script that provides support for HTML5 in older browsers.

TRUE

IDE (Integrated Development Environment)

A software package providing comprehensive coverage of all phases of the HTML development process. HTML 7

Web Browser

A software program that retrieves and displays web pages. HTML 5

Background

A solid color, picture, or graphic against which other elements on the web page appear.

Background

A solid color, picture, or graphjic against which other elements on the web page appear.

Image Map

A special type of inline image in which you define one or more areas as hotspots.

Uniform Resource Locator (URL)

A standard address format used to link a variety of resource documents.

Network

A structure in which information and services are shared among devices known as nodes or hosts. HTML 4

Inline Styles

A style added as attributes of an HTML element. HTML 87

Embedded Styles

A style added to the head of an HTML file.

User Agent Styles

A style built into the web browser itself.

Why is the fallback option provided to an audio clip?

ANSWER: It is considered bad design to add a feature to a web page without also providing some fallback option to users who cannot take advantage of that feature. One type of fallback option is used by specifying two audio sources so that if the browser cannot play the MP3 version of the audio clip, it can attempt to play the OGG version. If the browser cannot play either version or does not support the audio element at all, the user can follow the source elements with HTML code that the browser will recognize. The simplest fallback option is a text string indicating that the user needs to upgrade the browser to take advantage of the feature you added to the page. Plug-ins can act as a fallback option for browsers that do not support the HTML5 multimedia elements by adding the embed element to the end of the audio element as the last option for the browser.

_____ units are specified in one of five standard units of measurement.

Absolute

Identify the first step to create a responsive web table that relies only on CSS.

Add a text of data labels as attributes of all of the td elements in the table body.

Inline Style

Adding a style to an individual HTML such as a heading or paragraph.

Internal Style Sheet

Adding the style within the <head> </head> tags of the HTML documents to define syle for an entire webpage; also caled an embedded style sheet.

Internal Style Sheet

Adding the style within the <head> and </head> tags of the html documents to define style for an entire web page; also called an embedded style sheet.

User agent style

Alex's woodworking shop is trying to design a web page with Cascading Style Sheets (CSS). Alex would like to create the new design based on the latest elements and styles from Hypertext Markup Language (HTML) and CSS. He has created a few sample pages: home.htm ---describes the business and contact information Product.htm ---displays a list of product descriptions Custom.htm ---displays a list of custom products Alex has forgotten to give any style for all of his pages. In this case, identify the style that would be applied to his pages.

a.submenuTitle:hover+ul.submenu

Alex, a web designer, is assigned the task of creating a mobile-device-friendly website for a leading fashion outlet called AllStyles. A desktop version of AllStyles's website already exists. Alex can refer to this desktop version of the website to create the mobile website design. Alex has placed each of the nested lists within a class called submenu. He wants to display a nested submenu only when the user hovers the mouse pointer over its associated submenu title. Which of the following selector formats should be used by Alex to select the submenu that is immediately preceded by a hovered submenu title?

Which of the following statements is true of outline styles?

All of the outline styles properties can be combined into the outline shorthand property.

Transitional

Allows the use of deprecated tags.

Accessible Rich Internet Application (ARIA)

An HTML standard that assists screen readers in interpreting web page content.

Conditional Comment

An Internet Explorer extension that encloses content that should only be run by particular versions of Internet Explorer. HTML 20

TRUE

An additional factor in applying a style sheet is that properties are passed from a parent element to its children in a process known as style inheritance.

Hotspot

An area of an image that activates a function when selected.

Quirks Mode

An operating mode in which the browser renders the web page based on styles and practices from the 1990s and early 2000s. HTML 9

Standards Mode

An operating mode in which the browser renders the web page in line with the most current HTML specifications. HTML 9

Navigation list

An unordered list of hypertext links placed within the nav element

dynamic

Another type of pseudo-class is _____ pseudo-class in which the class can change state based on the actions of a user.

Host

Any network device that is capable of sending and/or receiving data electronically. HTML 4

Format

Appearance of the webpage that includes images, color, headings, and horizontal rule.

Briefly explain the procedure followed for setting the page size.

As printed media can vary in size and orientation, the following size property allows web authors to define the dimensions of a printed page: size: width height; where width and height are the width and height of the page. Thus, to define a page that is 8.5 inches wide by 11 inches tall with a 1-inch margin, one should apply the following style rule: @page { size: 8.5in 11in; margin: 11n; } Once can replace the width and height values with the keyword auto (to let browsers determine the page dimensions) or inherit (to inherit the page size from the parent element). If a page does not fit into the dimensions specified in the @page rule, browsers will either rotate the page or rescale it to fit within the defined page size.

_____, a principle of design, involves the distribution of elements.

Balance

Briefly describe the styles applied to track cues.

CSS supports the following cue pseudo-element to format the appearance of the cues appearing within a media clip: ::cue { styles } The styles for the cue pseudo-element are limited to the background, color, font, opacity, outline, text-decoration, text-shadow, visibility, and white-space properties. For example, the following style rule displays all cues in a 2em yellow serif font on a red background: ::cue { background: red; color: yellow; font: 2em serif; } The cue pseudo-element selects all of the cue text in the media clip. To format specific cues or text strings within a cue, a user can identify the sections of the cue text using the following markup tags: • <i></i> for italicized text • <b></b> for bold-faced text • <u></u> for underlined text • <span></span> to mark spans of text • <ruby></ruby> to mark ruby text • <rt></rt> to mark ruby text WebVTT also supports tags that are not part of the HTML library, such as the following <c></c> tag used to mark text strings belonging to a particular class: <c.classname></c> Here, classname defines the class. And for captions that distinguish one voice from another, WebVTT supports the following <v></v> tag: <v name></v> Here, name is the name of the voice associated with the caption. For cues based on their class name, add the class name to the cue pseudo-element as follows: ::cue(.classname) { style rules } Here, classname is the class marked within in the <c></c> tag. To format voice text, use the style rule as follows: ::cue(v[voice=name]) { style rules } Here, name is the name assigned in the <v></v> tag.

Word Wrap

Causes text lines to break at the right edge of the window and appear on a new line.

Used for selecting data values limited to two possibilities, such as "yes" or "no"

Check boxes

While designing websites for mobile devices, _____ colors should be used so that pages are easily visible in outdoor lighting

Contrasting

The advantage of the _________ approach is that a wide variety of timings can be defined, including timings in which a transition can stop, reverse itself, and then go forward again to its end state.

Cubic Bézier curves

Fonts

Definition of the style and appearance of each character in an alphabet.

They are often used for database applications that read the contents of HTML files.

Data attributes

Identify a list which when applied to an input box, the values appear as a pop-up list of suggested values.

Data list

Which of the following methods is used to determine the day of the week on which a month starts?

Day;

_____ is the process of locating and fixing a programming error.

Debugging

Attributes

Define additional characteristics for the HTML tag

Attributes

Defines additional characteristics for the HTML tag.

TRUE

Different items within a flexbox can have different growth rates.

Which of the following can be referenced only after the browser has finished parsing the page content?

Document objects

Alt

Document type used to support frames

Alt

Document type used to support frames.

A background image is attached to its element so that as the element content is scrolled through, the background image remains still.

FALSE

In JavaScript, the clearTimeout() method is used to clear all repeated commands.

FALSE

The align-items property is only impactful when there are multiple lines of flex items.

FALSE

The while statement is used to exit a program loop before the stopping condition is met.

FALSE

A decimal is a number expressed in the base 16 numbering system rather than in the commonly used base 10 system

False

A flexbox is a box containing items whose sizes are fixed.

False

A form element must be placed only within the header tag of a web page.

False

A generic font describes the general appearance of a typeface and relies on a specific font definition.

False

A page name should be created to define styles for the first, left, and right pages.

False

A plug-in works within a browser with CSS and JavaScript files to present a customizable player.

False

A transition must start immediately after an event that triggers it.

False

A video file typically contains a single codec that is used for both audio and video images.

False

A web table can contain any number of thead and tfoot elements but only one tbody element.

False

An animation has a single state of operation, so a radio button is used to control the animation.

False

By default, legends are placed in the top-right corner of the field set box.

False

By default, the @page rule is applied only to the first page of the printed output.

False

By default, the caption cues are centered at the top of the video window.

False

Cascading Style Sheets (CSS) 3 introduced opacity to the CSS color models where opacity defines how transparent the color appears.

False

Client-side image maps are easier to create but rely on a connection to the server in order to run.

False

Desktop computers have two types of viewports: a visual viewport and a layout viewport.

False

Embedded style sheets are created by web page authors and consist of styles that are inserted directly within the body element of a Hypertext Markup Language (HTML) document.

False

Which of the following is true of field sets?

Field sets act like block elements that can expand to accommodate their content.

Space-Separated List

Filter functions can be combined in a _____ to create new effects.

TRUE

Fixed layouts should only be used when one has more control over the devices that will display the page.

_____ can be used to have a single specification that automatically adapts itself to the screen width without requiring a new layout design.

Flexible boxes

_________ refers to the state in which an element has been clicked by the user, making it the active control on the form.

Focus

Processes the form when clicked

Form buttons

Numbered List

Formats inforation in a series using numbers or letters; also called an ordered list.

Ordered list

Formats information in a series usingn umbers or letters; also called a numbered list.

Unordered List

Formats information using small images called bullets; also called a bulleted list.

Bulleted list

Formats information using small images or symbols called bullets; also caled an unordered list.

HSL

Graphic designers consider _____ easier to use because it allows them to set the initial color based on hue and then fine-tune the saturation and lightness values.

Joint Photographic Experts Group (JPEG)

Graphic image saved using a lossy compression technique that discards some data smooth variation of tone and color.

It is the industry standard for high-definition video streams.

H.264

.html and .htm

HTML files with an extention of .html can be viewed on web servers running an operating system that allows long file names. Web servers that dont allow long file names must use .htm

Explain table row group elements and the order that should be maintained when writing an HTML code.

HTML supports three row group elements, which define rows that belong to the table head, table footer, or table body. They are marked using the thead, tfoot, and tbody elements. The order of these elements while entering them in the HTML code is important. The thead element must appear first, followed by the tfoot element (if it exists), and finally the tbody element. A table can contain one thead and one tfoot element, but it can include any number of tbody elements to mark row groups that contain several topical sections.

This media type is used for mobile devices with small screens and limited bandwidth.

Handheld

background-color: color;

How is background color defined in a Cascaded Style Sheets (CSS) file?

_____ is the tint of a color and is usually represented by a direction on a color wheel.

Hue

scaleY(y)

Identify a CSS3 2D transformation function that resizes an object by a factor of x horizontally.

scheme: location

Identify a general structure shared by all Uniform Resource Locators (URLs)

It is placed either directly before or directly after a figure box content.

Identify a true statement about the figcaption element.

content="text"

Identify an attribute of the meta element that provides the value associated with the http-equiv or name attributes.

translate3D(offX, offY, offZ)

Identify the CSS3 3D transformation function that shifts an object off X pixels vertically, and off Y pixels vertically, and off Z pixels along the z-axis.

translate3d(offX, offY, offZ)

Identify the CSS3 3D transformation function that shifts an object offX pixels horizontally, offY pixels vertically, and offZ pixels along the z-axis.

coords="left,top,right,bottom"

Identify the coordinate attribute for the rectangular hotspots of an image.

flex-flow: direction wrap;

Identify the correct flex-flow style that combines both the flex-direction and flex-wrap properties.

Repeat

Identify the default type for the background-repeat style.

repeat

Identify the default type for the background-repeat style.

Identify the link element that accesses a style sheet file named output.css only when the device is a printer or a projection device.

@media devices { style rules }

Identify the media rule that must be included in a Cascading Style Sheet (CSS) file so that media queries can be used to associate specific style rules with specific devices.

@page { style rules }

Identify the page rule using which styles are applied to a page box.

background-clip: type;

Identify the property that can be used to change the definition of an element's background.

border-image: url(url) slice repeat;

Identify the property that is used to apply a border image.

space

Identify the repeat option in the border-image property that distributes extra space around the tiles when the slices don't fill the sides with an integer number of tiles.

transform: effect(params);

Identify the syntax of the transform property.

sibling

If _________ elements are floated along the same margin, they are placed alongside each other within a row.

FALSE

In fluid layouts, all measurements are expressed in em units and based on the default font size used in the page.

Briefly explain how to control an animation.

In many applications, a user may not want an animation to start automatically when the page loads but rather in response to the user clicking a form button. The user can control an animation using JavaScript or a CSS solution. Because an animation can have two states of operation—play or pause—a user can utilize a check box to control the animation. If the check box is selected, the animation will play; if the check box is not selected, the animation will be paused.

Content-box

In the background-clip property, the _________ type is used to extend the background only through the element content.

padding-box

In the background-clip property, the _________ type is used to extend the background only through the padding space.

FALSE

In the opacity property, if the value is 1, the object is completely transparent

Inline Image

Indicates that the image of graphic file is not part of the HTML file.

Inline Image

Indicates that the image or graphic file is not part of the HTML file.

Body

Information that is displayed in the browser window anjd can include text graphics and other elements.

In the accompanying figure, what does Box A represent?

Input box

Used for text and numerical entries

Input boxes

Which of the following is true of nesting a control within a label?

It allows the user to move both the label text and the control as a single unit around the page.

Identify the significance of "text" in <form id="text">.

It identifies the form.

Identify the use of the inset keyword used in the box-shadow property.

It is used to create an interior shadow.

What is the purpose of colspan in <td colspan="7">?

It sets each cell to span seven columns within its row.

*background-size:* Keywords (3)? Order of values? What if only one value is set? Multiple background syntax?

Keywords: ("auto", "cover" and "contain") 1) background-size: auto Default value. The background image is displayed in its original size 2) background-size: cover Resize the background image to cover the entire container, even if it has to stretch the image or cut a little bit off one of the edges 3) background-size: contain Resize the background image to make sure the image is fully visible *Note:* if one value set height becomes "auto" 4) background-size: 50% 4) background-size: 50px Two-value syntax *first value: width of the image, second value: height* 5) background-size: percentage Sets the width and height of the background image in percent of the parent element. 6) background-size: length Sets the width and height of the background image. *Note:* the multiple background syntax (separated with comma) (https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_background-size5) background: url(img_tree.gif), url(mountain.jpg); background-repeat: no-repeat; background-size: contain, cover; https://www.w3schools.com/cssref/css3_pr_background-size.asp

This determines the properties of the device rendering a website page so that appropriate designs can be delivered to specific devices.

Media queries

_____ are used to associate a style sheet or style rule with a specific device or list of device features.

Media queries

space-between

Lara is the chief editor of "Laughter and Life," an online magazine. Lara has assigned Jenny the task of redesigning the magazine's website. Lara has supplied Jenny with all the necessary documents and images that are essential to enhance the look of the website. Lara's requirements necessitate the use of flexboxes to redesign the website. Jenny wants to distribute the flex items in the magazine's website evenly with the first and last items aligned with the start and end of the main axis. Identify the keyword Jenny must assign to value in the align-content: value; property.

horizontal line

Lew Russell, owner of Lew's Surfboards, would like to develop a page that would show a list of surfboard types along with their descriptions. If Lew wanted to accent the division between the surfboard types, which of the following tags should he use?

Horizontal Rules

Lines displayed across a webpage to separeate different sections of the page.

While designing websites for mobile devices, these need to be easily accessed via a touch interface.

Links

Favorites

List where web pages are added for quick access in the future; another name for bookmarks.

LAN

Local Area Network

Portable Network Graphics (PNG)

Lossless compresses file format that supports multiple colors and resolutions.

Lucy wants to develop a Web page to display her information. She wants to just start with a basic page that lists her accomplishments, her work history, and the different computer classes she has taken. She would like each section clearly identified. Lucy's page will require at least_____ headings for what she wants to display.

unordered list

Lucy wants to develop a Web page to display her information. She wants to just start with a basic page that lists her accomplishments, her work history, and the different computer classes she has taken. She would like each section clearly identified. Which type of lists would work best for listing Lucy's accomplishments?

_________ is a widely used proprietary format developed by Apple based on the Apple QuickTime movie format.

MPEG-4

The best way to test this is to view it directly on a mobile device.

Mobile interface

Which of the following is true of transformations in three dimensions?

Negative values along the axes are to the left, up, and away from a reader.

_________ is an open source format developed by the Xiph.org Foundation using the Theora codec as an alternative to the MPEG-4 codec.

Ogg

page breaks

Once a page name is defined, the content of an element will appear on its own page, with the browser automatically inserting _________ before and after the element if required.

Created with a group of input elements with a type attribute value of radio, sharing a common data field name

Option buttons

Used to group items on a drop-down list

Option groups

FALSE

Order Values for flexboxes cannot be negative.

widows

Page breaks within block elements can often leave behind _____, which is a fragment of text left dangling at the top of page.

Declatation

Part of the style statement that identifies how the element(s) should appear.

Download

Process of copying something from a device to your computer.

List-style-type

Property entered within the <ol> </ol> and <ul> </ul> tags to change the bullet or number type in an unordered list.

Color

Property that lets you change the color of various elements on the webpage.

The desktop version of the website contains a long list of hyperlinks and this can obstruct the view of the main content when viewed from a mobile device. Which of the following should Alex use to hide this long list of hypertext links so that it appears only in response to a tap of a major heading in the navigation list?

Pulldown menus

FALSE

Relative units define a font size using one of five standard units of measurement.

_________ images, a primary component of responsive design theory, rescale based on the size of a viewing device.

Responsive

The table features are hidden as it does not use the table header or footer.

Responsive table design

Rem

Root em Unit

Style

Rule that defines the appearance of an element on a web page.

background-position: 30px;

Sam is trying to decide the best way to design the background of his web page. He would like to add background images and background styles to his design. He needs to understand how browsers load a background image and learn about background style properties. Sam wants to change the position of an image on his web page. He wants to place the background image 30 pixels to the right of an element's left edge and 30 pixels down from the top edge. Identify the correct style that Sam should use.

vertically

Scroll bars for overflow content are usually placed _____ so that one can scroll down to view the extra content.

Multiple shadows can be added to text by including each shadow definition in a comma-separated list.

TRUE

Used for a long sequence of options

Selection lists

The boundary around the entire table is hidden but a 1-pixel blue boundary is assigned to the cells within the table.

Separate borders model

Cascading Style Sheet (CSS)

Series of rules that defines the style for a webpage or website.

*background-attachment:* keywords (3) and syntax? What does?

Sets whether a background image is fixed or scrolls with the rest of the page 1) background-attachment: scroll The background image will scroll with the page. This is default 2) background-attachment: fixed The background image will not scroll with the page 3) background-attachment: local The background image will scroll with the element's contents https://www.w3schools.com/cssref/pr_background-attachment.asp

_____ selectors are used to select elements based on elements that are adjacent to them in the document hierarchy.

Sibling

nested lists

Since the li element is itself a grouping element, it can be used to group other lists, which in turn creates a series of _____.

Identify a widget that allows the user to interact with the form for entering numeric values confined to a specified range.

Slider control

Identify the widget that limits a numeric field to a range of possible values by allowing users to drag a marker horizontally across the possible field values.

Slider control

This is provided by mobile phone companies for developers to use to test their programs and websites.

Software development kit

elastic layouts

Some designers propose the use of _____ in which all measurements are expressed relative to the default font size using the em unit.

_____ is a single cell that occupies more than one cell row and/or column.

Spanning cell

They are created by adding the rowspan and colspan attributes to either td or th elements.

Spanning cells

Value

Specifies the display parameters for a specific property

Value

Specifies the display parameters for a specific property.

If a single value is specified in the background-position property, the browser applies that value to both the horizontal and vertical position.

TRUE

In a form element, attributes specify how the form should be processed by the browser.

TRUE

Save

Storing a web page permanently on a hard disk, USB flash drive, CD, or DVD.

Property

Style applied to a declaration. Examples are color, text indent, border width, and font style.

Property

Style applied to a declaration; examples are color, text indent, border width, and font style.

Embedded Style Sheet

Style sheet in which you add the style sheet within the <head> </head> tags of the HTML document to define the style of an entire web page.

An animation is limited to two style rules defined at the initial and end states.

TRUE

By default, items are placed in an array either in the order in which they are defined or explicitly by index number.

TRUE

Columns and column groups accept only CSS style properties to modify the column borders, background, width, and visibility.

TRUE

Header cells and data cells are types of table cells supported by web tables.

TRUE

Ted is asked to create a page containing his family photos for a family reunion website. He will have about 20 pictures to post, with a caption that he wants to display before each one. Each picture is a group photo of a particular family. What character entity reference could ted use to add a notice at the bottom of the page to remind viewers that the photos are copyrighted?

A _____ is a control used to enter text strings that may include several lines of content.

Text area box

Exernal style sheet

Text file that contains all of the styles you want to apply and is saved with the file extention .css; also called a linked style sheet.

Linked Style Sheet

Text file that contains all the styles you want to apply and is saved with the file extention .css; also called an external style sheet.

Title

Text that appears on the title and task bar of the browser window when the web page appears.

display: list-item

The Yacht club has a web site that consists of a picture of the yacht club room along with the yacht club rules on the left. On the right side is a list of upcoming events, the company logo, and the yacht club teacher training dates. Sue, the web designer, needs some help with Cascading Style Sheets (CSS) to make sure the pages display correctly. To make the webpage display the yacht club rules in a bulleted list, _____ should be used.

title

The _____ element is part of the document head because it's not actually displayed as part of the web page, but rather appears externally within the browser tab.

Figure

The _____ element is used to contain an image file and can also be used to mark any page content that should stand apart from the main content of an article.

head

The _____ element, a Hypertext Markup Language (HTML) metadata element, contains a collection of metadata elements that describe the document or provide instructions to the browser.

auto

The _____ value of the overflow style keeps an element at a specified size, adding scroll bars only as they are needed.

hidden

The _____ value of the overflow style keeps the element at a specified height and width, but cuts off excess content.

*background-origin:* what does? When works (2)? Keywords (3)?

The background-origin property specifies the origin position (the background positioning area) of a background image. *Note:* This property has no effect if background-attachment is "fixed". *Note2:* Works just in case when background-repeat: no-repeat. !!!1) background-origin: padding-box *Default value.* The background image starts from the upper left corner of the padding edge !!!2) background-origin: border-box The background image starts from the upper left corner of the border 3) background-origin: content-box The background image starts from the upper left corner of the content https://www.w3schools.com/cssref/css3_pr_background-origin.asp

Describe the process of testing a mobile website.

The best way to test a mobile interface is to view it directly on a mobile device. However, given the large number of mobile devices and device versions, it's usually not practical to do direct testing on all devices. An alternative to having the physical device is to emulate it through a software program or an online testing service. Almost every mobile phone company provides a software development kit or SDK that developers can use to test their programs and websites. Android SDK, iOS SDK, Mobile Phone Emulator, Mobile Test Me, MobiOne Studio, Opera Mobile SDK, and Windows Phone SDK are some of the popular device emulators. Browsers are also starting to include device emulators as part of their developer tools.

Which of the following statements is true of adding adjacent borders, to a table, using CSS?

The border style with the highest priority is used if the two borders have the same width but different styles.

Lightness

The brightness of a chosen color, ranging from 0% to 100%.

ASCII

The character set use for the English Alphabet.

Source Code

The code of instructions used to create a web page or program.

relative

The coordinates for the section element need not be defined as long as its position is set to _____.

Normal text

The default text format used for the main content of a webpage.

contrast

The design principle _________ consists of the differences among all of the page elements.

Deprecated

The features and code from earlier HTML versions that have been phased out and are either no longer supported or developed. HTML 6

The first set of tags beyond the <!DOCTYPE HTML> tag that indicate the start and end of an HTML document.

Root folder

The folder at the top of the folder hierarchy, containing other folders.

HTML 4.01

The fourth version of HTML, released in 1999, that provided support for multimedia, online commerce, and interactive scripts. HTML 5

element

The fundamental building block in every Hypertext Markup Language (HTML) document is the _____ tag, which marks a component in the document.

Element Tag

The fundamental building block of an HTML file, used to mark every document element. HTML 9

FALSE

The grouping element, ul, contains the definition associated with a term from a description list.

FALSE

The growth value of flex items defines the initial size of an item before a browser attempts to fit it to the flexbox.

Element Attribute

The part of an element that provides information to the browser about the purpose of the element or how the element should be handled by the browser. HTML 11

Padding Space

The part of the box model that extends from the element content to the element border.

*image-rendering:* what does? Keywords (3)?

The image-rendering CSS property sets an image scaling algorithm. The property applies to an element itself, to any images set in its other properties, and to its descendants. image-rendering: auto | crisp-edges | pixelated; 1) auto - 2) crisp-edges - does not really work 3) pixelated - *extremely useful for patterns and 2D graphics*, but supported only Chrome and Opera https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering

*image-set()* what does? Syntax? Support?

The image-set() CSS function notation is a method of letting the browser pick the most appropriate CSS image from a given set, primarily for high pixel density screens. EX: background-image: image-set( "cat.png" 1x, "cat-2x.png" 2x, "cat-print.png" 600dpi ); *Does not really has any support nowadays* https://developer.mozilla.org/en-US/docs/Web/CSS/image-set

Saturation

The intensity of a chosen color, ranging from 0% to 100%.

The item marked _____ in Figure 3.1 represents the visible value of the overflow property

Unicode

The largest character set supporting up to 65,536 symbols that can be used with ay of the world's languages.

HTML5

The latest version of HTML, compatible with earlier HTML releases. HTML 5

UTF-8

The most common character encoding in present use.

UTF-8

The most common character encoding in use is_____.

Identify a true statement to determine the number of columns in a web table.

The number of columns is the number of cells within the table rows.

*object-fit:* what does? Keywords (5)? When works?

The object-fit CSS property sets how the content of a replaced element, such as an <img> or <video>, should be resized to fit its container. *Note:* the img container should have specific width and height object-fit: none | contain | cover | fill | scale-down; 1) none - The replaced content is not resized. 2) contain - The replaced content is scaled to maintain its aspect ratio while fitting within the element's content box. 3) cover - The replaced content is sized to *maintain its aspect ratio* while filling the element's entire content box. 4) fill - The replaced content is sized to fill the element's content box. *Default* 5) scale-down - The content is sized as if none or contain were specified, whichever would result in a smaller concrete object size. https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit

*object-position:* what does? When works? Values (3)?

The object-position CSS property specifies the alignment of the selected replaced element's contents within the element's box. (mostly for <img>) *Note:* the img container should have specific width and height. In addition, the object should be smaller than the container. (So, depends on object-fit) 1) object-position: top | bottom | left | right | center Keywords could be used *two in conjunction* or If you only specify one keyword, the other value will be "center" 2) background-position: x% y% If you only specify one value, the other value will be 50%. 3) background-position: xpos ypos If you only specify one value, the other value will be 50%. *You can mix % and positions* https://developer.mozilla.org/en-US/docs/Web/CSS/object-position

What are the CSS properties that are used to manage column breaks?

The placement of column breaks can be controlled through several CSS properties. The size of column orphans (a line of text stranded at the bottom of a column) can be controlled using the following orphansproperty, orphans: value; where value is the minimum number of lines stranded before a column break. Similarly, to control the size of column widows (a line of text placed at the top of a column), the following widows property is used, widows: value; where value is the minimum number of lines placed after the column break. Another way to define a column break is to use the properties break-before: type; break-after: type; where type can be either auto (to allow the browser to automatically set the column break) or always (to always place a break).

Vendor Prefix

The prefix added to a browser extension

Style inheritance

The principle by which style properties are passed from a parent element to its children.

Scalable

The principle by which text is resized using relative units.

Character encoding

The process by which the computer converts text into a sequence of bytes and then converts those bytes back into characters. HTML 17

Hypertext Transfer Protocol (HTTP)

The protocol used by devices on the web.

TRUE

The radii of individual corners are equal to the radii of hypothetical circles placed at the corners of a box with the arcs of the circles defining the rounded circles.

Internet Assigned Numbers Authority (IANA)

The registration authority used to register the top levels of every domain name.

Which of the following statements is true of row groups?

The rows are determined based on the total number of cells within a table.

Syntax

The rules governing how a language should be used and interpreted. HTML 5

Domain name

The server name portion of a URL.

Ending tag

The tag that marks the end of the element content.

Starting Tag

The tag that marks the start of the element content

FALSE

The text-level element "b" marks content that acts as a hypertext link.

Hue

The tint of a color, represented by a direction on the color wheel.

Extension

The top level of a URL, indicating the general audience supported by the web server.

World Wide Web

The totality of interconnected hypertext documents on the Internet. HTML 4

What are the pseudo-classes for valid and invalid data?

The valid and invalid pseudo-classes are used to format controls based on whether their field values pass a validation test or not. For example, the following style rule displays all the input elements containing invalid data with a light red background: In put: invalid { background-color: rgb (255, 232, 233); } On the other hand, the following style rule displays all the input elements containing valid data with a light green background: input: valid { background-color: rgb (220, 255, 220); } Both of these style rules set the background color whether the input element has the focus or not. Displaying a form full of input backgrounds with different background colors can be confusing and distracting to the user. As a result, it is better practice to highlight invalid field values only when those input controls have the focus, as shown in the following style rule that combines both the focus and invalid pseudo-classes: input:focus:invalid { background-color: rgb (255, 232, 233); }

Start Page

The web page that appears each time a browser window opens; also called a home page.

Homepage

The web page that appears each time a browser window opens; also called a start page.

_________ is a royalty-free codec developed by the Xiph.org Foundation that produces video streams that can be used with almost any container.

Theora

TRUE

There is no limit to the number of hotspots one can add to an image map.

A pixel is a relative unit because the actual rendered size depends on the density of the output device.

True

A table contains five columns where one of the cells in a row spans three columns. Identify the number of table cells that will exist in that row.

Three

Consider the following code. <colgroup> <col span="2" class="Frstcols"/> <col id="Lastcol"/> <colgroup> How many columns does the <colgroup> element create?

Three

TRUE

Tiling is when a browser loads a background image and then repeats the image in both the vertical and horizontal directions until the entire background is filled.

Describe the types of layouts that are used to design a form.

To be effective, the layout of the form should aid the user in interpreting the form and navigating easily from one input control to the next. There are two general layouts, one in which the labels are placed directly above the input controls in a single column and the other in which the labels and controls are placed side by side in two columns. Usability studies have shown that a single column layout is more accessible because the labels are placed more closely to their input controls. However, for long forms involving many fields, a single column layout can be difficult to work with due to the extensive vertical space required. The width of an input box is set by adding the following size attribute to the input element in the HTML file as given below: size="chars" Here, chars is the width of the input box in characters. For example, the following input element sets the width of the input box for a field to two characters: <input id="state" size="2" type="text" />

absolute positioning

To make the submenus in a tablet device overlay the page content, the submenus should be placed with _____.

TRUE

To place an object with absolute positioning, use either the top/left coordinates or the bottom/right coordinates but not all four coordinates at the same time.

border-radius

To round off any of the four corners of a border, the _____ property should be applied.

What are the attributes that tell the browser how the form should interact with the web server?

To specify where to send the form data and how to send it, the following action, method, and enctype attributes are defined. <form action="url" method="type" enctype="type">content </form> Here, the action attribute provides the location of the web server program that processes the form; the method attribute specifies how the browser should send form data to the server; and the enctype attribute specifies how the form data should be encoded as it is sent to the server. The method attribute has two possible values: get and post. The default is the get method, which tells the browser to append the form data to the end of the URL specified in the action attribute. The post method sends the form data in its own separate data stream. The enctype attribute has three possible values in predefined formats for a specific purpose

_____ measures the amount of space between words.

Tracking

A challenge in delivering multimedia content is presenting it in a form that can be retrieved quickly and easily without loss of quality.

True

A class attribute can be included by placing a table in the schedule class to distinguish it from other tables that may exist on a website.

True

A default value need not be specified; the text area box can be left empty or the placeholder attribute can be used to provide a hint to users about what to enter into the text box.

True

Absolute Units

Units that are fixed in size regardless of the output devices.

Spam

Unsolicited e-mail sent to large numbers of people.

Headings

Used to set off paragraphs of text or different sections of a page and are a larger font size than normal text.

Frameset

Used to support frames on a webpage, allows the use of deprecated tags.

Frameset

Used to support frames on aw ebpage and allows the use of deprecated tags.

Definition list

Useful to create a glossary like list of terms and definitions that offsets information in a dictionary like style.

Bookmarks

User list of favorite web pages located in the broswer

Which of the following is an example of web safe font stacks?

Verdana

It is the original audio format for Windows PCs, which is commonly used for storing uncompressed audio, making it impractical for all but the shortest audio clips.

WAV

Explain viewports and device width. Also, discuss setting widths in media queries.

Web pages are viewed within a window called the viewport. Mobile devices have two types of viewports: a visual viewport displaying the web page content that fits within a mobile screen and a layout viewport containing the entire content of the page, some of which may be hidden from the user. The two viewports exist in order to accommodate websites that have been written with desktop computers in mind. A mobile device will automatically zoom out of the page in order to give users the complete view of the page's content, but this often results in a view that is too small to be usable. While the user can manually zoom into the page to make it readable within the visual viewport, this is done at the expense of hiding content.

double-tap

When a hover event is used to hide an object or display it, mobile browsers employ a _____ event.

Semantic

When the name of the tag reflects the purpose of the tag.

Semantic

When the name of the tag reflects the purpose of the text.

Strict

When want to prohibit the use of deprecated tags.

Which item in Figure 3.1 represents the scroll overflow style?

180deg

Which of the following angles used in the filter function hue-rotate (angle) displays the complimentary colors?

coords="0,0,width,height"

Which of the following defines the default hotspot for an image?

visible

Which of the following is the default overflow property?

Ellipse

Which of the following is the default shape value for the radial-gradient function?

farthest-corner

Which of the following is the default size keyword in the radial-gradient function?

Negative values along the axes are to the left, up, and away from a reader.

Which of the following is true of transformations in three dimensions?

Negative values along the axes are to the left, up, and away from the reader.

Which of the following is true of transformations in three dimensions?

Text-transform

Which of the following properties is used to control the casing of text within an element?

border-side-width: width;

Which of the following properties is used to define the thickness of a specific border?

WAN

Wide Area Network

Relative

_____ units express font size according to the size of other objects within a web page.

A group of web designers and programmers called the _____ settled on a set of standards for all browser manufacturers to follow.

World Wide Web Consortium

W3C

World Wide Web Consortium

* wildcard selector

_____ matches any element in the hierarchy.

Tracking

_____ measures the amount of space between words.

Lightness

_____ measures the brightness of a color and ranges from 0% (black) up to 100% (white).

Identify a syntax used to create a spinner control using an input element. a. <input name="name" id="id" type="number" value="value" step="value" min="value" max="value" /> b. <input name="name" id="id" type="number" value="value" set="value" min="value" max="value" /> c. <input name="name" id="id" type="number" value="value" size="value" min="value" max="value" /> d. <input name="name" id="id" type="number" value="value" area="value" min="value" max="value" />

Identify a true statement of a JavaScript program in a web form. a. JavaScript intercepts the content of the form before the browser attempts to contact the CGI script and report whether the data contained in the survey form has been correctly filled out or not. b. JavaScript is a closed-source programming language, which provides tools and a programming environment for communicating the strategy and overall administration of distributed applications. c. JavaScript is extracted by all layout engines in a similar way; as a consequence, this grounds consistency in terms of functionality and interface. d. JavaScript is a bug-free Visual Basic scripting language, which is used only for networking applications.

Identify an animation property that repeats the animation being played without stopping. a. animation-iteration-count = infinite b. animation-timing-function = ease c. animation-play-state = running d. animation-delay = time

Identify the Cascading Style Sheet (CSS) rule that imports a file named screen.css only when a screen or projection device is being used. a. @import url("screen.css") screen, projection; b. #import url("screen.css") screen, projection; c. @import url("screen.css") screen&&projection; d. @import url("screen.css") *screen, *projection;

Identify the correct flex-flow style that combines both the flex-direction and flex-wrap properties. a. flex-flow: direction wrap; b. flex-flow: direction||wrap; c. flex-flow: direction&&wrap; d. flex-flow: flex-direction, flex-wrap;

Identify the correct hierarchy of tags to create a web table. a. <table>, <tr>, <td> </td>, </tr>, </table> b. <table>, <td>, <tr> </td>,</tr> </table> c. <tr>, <table>, <td> </td>,</table>, </tr> d. <tr>, <td>, <table>,</table>,</tr>,</td>

Identify the media query that applies style rules only to screens that are at least 300 pixels wide. a. @media screen and (min-width: 300px) { style rules } b. media screen and (@min-width: 300px) { style rules } c. media screen and (least-width: 300px) { style rules } d. @media screen and (@minwidth: 300px) { style rules }

Identify the query that matches any screen device that also supports color. a. @media screen and color { style rules } b. media (@screen) and (@color) { style rules } c. @media screen and @(color) { style rules } d. @media screen and (color) { style rules }

In the context of HTML audio and video element attributes, the preload attribute's type _____ is used to preload only descriptive data about a particular clip. a. metadata b. descriptions c. auto d. captions

In the element <track kind="type" src="url" label="text" srclang="lang" />, the _____ attribute defines the track category. a. kind b. label c. srclang d. src

Pete wants to change the appearance of the player against the page background when the video is playing on the web page. He wants the page background to show via see-through colors in the player. Which of the following values of the wmode parameter must he include in the code to accomplish this? a. transparent b. showall c. exactfit d. autohigh

When animating objects with CSS, the key frame values 0% and 100% can be replaced with the keywords _____. a. from and to b. first and last c. start and end d. open and close

Which of the following Flash player parameters recognizes a movie so that it can be referenced and has a value of text? a. id b. flashvar c. name d. wmode

Which of the following audio elements is used to embed audio clips within a web page? a. <audio src="url" attributes /> b. <audio src=attributes /> c. </audio src="url" "attributes"> d. </audio src="attributes"/>

Which of the following audio formats in HTML provides better sound quality, especially at lower bit rates? a. .ogg b. .mp3 c. .wav d. .aiff

Which of the following browsers supports all audio formats such as MP3, Advanced Audio Coding (AAC), Ogg, and WAV? a. Google Chrome b. Microsoft Internet Explorer c. Opera d. Safari

Which of the following browsers supports only the MPEG-4 video format? a. Safari b. Chrome c. Firefox d. Opera

Which of the following is a default value for border-collapse property? a. border-collapse: separate; b. border-collapse: collapse; c. border-collapse: inherit; d. border-collapse: initial;

Which of the following is true of a cue in a Web Video Text Tracks file? a. The cue is matched with specific time intervals within a media clip. b. The cue label holds the text of the cue. c. The cue lists are separated by a comma after a cue text. d. The cue times are entered in hh:ss:ms format.

Which of the following is true of animating objects in CSS? a. Animation creates an illusion of movement by displaying key frames in rapid succession. b. Animation is limited to two style rules defined at the initial and end states. c. Animations can be run only once as multiple images in rapid motion to a page object. d. Animations can only be run when a CSS property is being changed.

Which of the following is true of class in the table tag <table class=" ">? a. class is an attribute. b. class is an tag. c. class is an function. d. class is an label.

Which of the following properties must Andy use to set the gap between the borders created by using the border-collapse property? a. border-spacing: value; b. border-spacing: value; c. border: length; d. border: width;

Which of the following set of transition properties depicts the given image? a. Initial state background: white; color: black; transition: background 4s; End state background: green; color: white; b. Initial state background: white; color: white; transition: 0s; End state background: white; color: black; c. Initial state background: white; color: white; End state background: white; color: black; transition: background 4s; d. Initial state background: green; color: white; End state background: white; color: black; transition: background 4s;

Which of the following timing-function keywords allows a transition to occur more rapidly at the beginning and slow down near the end? a. ease b. ease-in c. ease-out d. ease-in-out

Wyona wants to ensure that the text box should accept only 5 characters for entering a zip code. Which attribute of a text box will allow her to do this? a. maxlength b. size c. codevalue d. character

_____ are windows that are embedded within a web page that displays the content of another page or Internet resource. a. Inline frames b. Key frames c. Framesets d. Frame vectors

_____ compress data so that it can be transmitted in a fast and efficient manner and then decompress it when it is to be read or played back. a. Codecs b. Bitmaps c. Add-ons d. Tokens

_____ is an HTML5 audio and video player with support for Flash and Microsoft Silverlight. a. MediaElement.js b. Projekktor c. Flowplayer d. Video.js

Portable Network Graphics (PNG)

a lossless compressed file format that supports multiple colors and resolutions.

selector

a part of the style statement that identifies page elements.

Selector

a part of the style statement that identifies the page element.

cascading style sheet

a series of rules that defines the style for a webpage

Alex has placed each of the nested lists within a class called submenu. He wants to display a nested submenu only when the user hovers the mouse pointer over its associated submenu title. Which of the following selector formats should be used by Alex to select the submenu that is immediately preceded by a hovered submenu title?

a.submenuTitle:hover+ul.submenu

By default, a browser places a table caption _____.

above the table

While creating a website for tablet design, objects placed with _________ positioning are removed from the document flow.

absolute

To make the submenus in a tablet device overlay the page content, the submenus should be placed with _____.

absolute positioning

inline style

adding style to an individual HTMLq

It arranges multiple lines of content along a flexbox's cross axis.

align-content

The animation property _________ sets the length of an animation in seconds or milliseconds.

animation-duration = time

format

appearance of a webpage

Format

appearance of the webpage that includes images, color, headings, and horizontal rule.

The default format in which the data is encoded as a long text string with spaces replaced by the + character and special characters replaced with their hexadecimal code values

application/x-www-form-urlencoded

To target a device based on its features, identify the syntax used to add a feature and its value to the media attribute. a. @media="devices and|or (feature:value)" b. media="devices and|or (feature:value)" c. media="devices and&&or (feature:value)" d. media="devices and|or (*feature:value)"

Which of the following HTML elements is used to add a row in a table? a. <td> b. <tr> c. <dd> d. <tl>

Which of the following HTML structures arranges text in multiple rows and columns? a. <div> b. <table> c. <span> d. <nav>

Which of the following MIME types is supported by Advanced Audio Coding (AAC) file format embedded in an HTML page? a. .wav b. .m4a c. .dvf d. .ogg

Which of the following is true of the default attribute when adding text tracks to a video file? a. It enables all the available tracks by marking them as default. b. It enables the active track by marking it with the default attribute. c. The default attribute is not required when there is a single track available. d. The default attribute is not required when there are multiple tracks available.

Which of the following languages is used to set the width of a media player, add borders, drop shadows, and apply filters and transformations to the media player's appearance? a. Ruby b. CSS c. PHP d. Perl

Which of the following properties helps Luis in making the content on the web page more readable by spreading the content into a specific number of columns on a single page? a. column-span; b. column-count; c. column-collapse; d. column-control;

Which of the following structures is the format of a Web Video Text Tracks file? a. WebVTT cue1 cue2 ... b. WEBVTT cue1 cue2 ... c. WVtt cue1 cue2 ... d. WVTT cue1 cue2 ...

Identify a true statement about the perspective property. a. A smaller perspective value causes the railroad tracks to appear to go farther before converging. b. A larger perspective value causes railroad tracks to converge over an apparently shorter distance. c. The perspective property can be used when there are several transformed objects within a container that all need to appear within the same 3D space within a common perspective. d. The perspective property uses a negative value that measures the strength of the perspective effect with higher values resulting in more extreme distortion.

b. A larger perspective value causes railroad tracks to converge over an apparently shorter distance.

Identify the property that can be used to change the definition of an element's background.

background-clip: type;

*background-image: linear-gradient()* values and their order?

background-image: linear-gradient(direction, color-stop1, color-stop2, ...); 1) direction - Defines direction (or an angle). EX1: background-image: linear-gradient(to bottom right, yellow, violet); (important to use *to* with keywords) EX2: background-image: linear-gradient(180deg, yellow, violet); 2) color-stop - This value consists of a color value, followed by an optional *stop position* (a percentage between 0% and 100% or a length along the gradient axis or value inpx). EX1: background-image: linear-gradient(to bottom right, yellow 50px, violet 70px); EX2: background-image: linear-gradient(180deg, yellow 70%, violet); https://www.w3schools.com/cssref/func_linear-gradient.asp just try this out: 1) background-image: linear-gradient(to right, red 80px, yellow 0px, yellow 160px, red 0px, red 240px, yellow 0px, yellow 320px, red 0px, red 400px); 2) background-image: linear-gradient(to right, red 20%, yellow 0px, yellow 40%, red 0px, red 60%, yellow 0px, yellow 80%, red 0px, red 100%); https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_gradient-linear_rainbow

*background-image: radial-gradient()* properties and their order? Size keywords (4)?

background-image: radial-gradient(shape size at position, start-color, ..., last-color); 1) shape - circle | ellipse (default) 2) size - farthest-corner (default) | closest-side | closest-corner | farthest-side the gradient extends to the defined position. *For example:* radial-gradient(closest-side at 60% 55%,blue,green) In this case gradient will be an ellipse. It will cover 80% horizontally because it will extend only 40% to the closet side and repeat the pattern to the other. The similar situation is with vertical side. the gradient will cover 90%. 1-2) instead of shape and size we can use numerical values. % (x than y) | px (x than y) EX: radial-gradient( 100px 200px at 60% 55%,blue,green) - an ellipse width: 100px, height: 200px 3) position - keywords (bottom left) | % (x than y) | px (x than y) Before position it is important to use at. 4) colors - the same as in linear-gradient https://www.w3schools.com/cssref/func_radial-gradient.asp

*background-image: repeating-linear-gradient()* properties and how to use?

background-image: repeating-linear-gradient(direction, color-stop1, color-stop2, ...); 1) direction - no changes 2) colors - without numerical values will be a regular gradient. If set the values up to 100% it will repeat the pattern Try out) background-image: repeating-linear-gradient(to right bottom,red 30px, yellow 0px, yellow 60px, red 0px, red 90px); https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_gradient-linear_repeating2 https://www.w3schools.com/cssref/func_repeating-linear-gradient.asp

*background-image: repeating-radial-gradient()* properties and how to use?

background-image: repeating-radial-gradient(shape size at position, start-color, ..., last-color); 1) shape size at position - no changes 2) colors - without numerical values will be a regular gradient. If set the values up to 100% it will repeat the pattern Try out) background-image: repeating-radial-gradient(circle, red 30px, yellow 0px, yellow 60px, red 0px, red 90px); https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_gradient-radial_repeating https://www.w3schools.com/cssref/func_repeating-radial-gradient.asp

Which of the following styles is used to specify the type of tiling to be applied to a background image, or even turn off tiling?

background-repeat: type;

*background:* properties and their order (8)? Notes?

background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment; Note: If one of the properties in the shorthand declaration is the bg-size property, you must use a / (slash) to separate it from the bg-position property, e.g. background:url(smiley.gif) 10px 20px/50px 50px; will result in a background image, positioned 10 pixels from the left, 20 pixels from the top, and the size of the image will be 50 pixels wide and 50 pixels high. Note: If using multiple background-image sources but also want a background-color, the background-color parameter needs to be last in the list. https://www.w3schools.com/cssref/css3_pr_background.asp

It defines the initial size of a flex item before a browser attempts to fit it to a flexbox.

basis size

The _____ grouping element contains content that is quoted from another source, often with a citation and often indented on a page.

blockquote

When creating row groups, the table _________ group appears after the table footer group to allow browsers to render the footer before receiving numerous groups of table body rows.

body

Identify the property that is used to apply a border image.

border-image: url(url) slice repeat;

Identify the style that can be used to create elongated or elliptical corners.

border-radius: horizontal/vertical;

Since a Uniform Resource Locator (URL) has no common break points such as blank spaces, applying the _________ option ensures that the text string of the URL will be kept to a manageable length by breaking it as needed to fit within the page layout.

break-word

The technique for locating the source of an error is to set up _____, which are locations where the browser will pause the program, allowing the programmer to determine the error at that position.

breakpoints

What is the output of the following code? for (var i = 0; i <= 360; i+=60)

i = 0, 60, 120, 180, 240, 360

Command buttons are created using the input element with the type attribute set to _____.

button

The ____ element is used to create a custom option.

button

Colin has created a web page that supports multiple audio sources. However, he is unsure if the browsers used by his clients will support the audio format he has included. Which of the following must he include in the code to notify the clients about any browser upgradation required to play an audio file? a. cue label b. text track c. fallback option d. kind attribute

Identify a syntax of the option element that contains an attribute to make an option as default in a selection list. a. <option value="value" for>text</option> b. <option value="value" enctype>text</option> c. <option value="value" selected>text</option> d. <option value="value" default>text</option>

Identify a syntax that sets the data type of the registerDate field to "date". a. <label for="register">Date of registration</label> <input name="Date" id="register" /> b. <label for="register">Date of registration</label> <input name="registerDate" id="date" /> c. <label for="register">Date of registration</label> <input name="registerDate" id="register" type="date" /> d. <label for="register">Date of registration</label> <input name="registerDate" id="date" type="register" />

Identify the link element that accesses a style sheet file named output.css only when the device is a printer or a projection device. a. <*link href="output.css" media="print&&projection" /> b. <link *href="&output.css" media="print, projection" /> c. <link href="output.css" media="print, projection" /> d. <link href="output.css" media="*print, *projection" />

Identify the media rule that must be included in a Cascading Style Sheet (CSS) file so that media queries can be used to associate specific style rules with specific devices. a. #media devices { style rules } b. &media devices { style rules } c. @media devices { style rules } d. *media devices { style rules }

In the accompanying figure of graphing the transition timings, the vertical axis measures the progress of the transition toward completion and the horizontal axis measures the duration. Which of the following graphs labelled A, B, C, and D represents the ease-in-out timing? a. A b. D c. B d. C

In the accompanying figure, the value of the timing-function is _____. a. alternate-reverse b. linear-backwards c. ease-out d. ease-in

In the context of HTML audio and video element attributes, the _____ attribute's type includes auto, none, and metadata. a. autoplay b. muted c. preload d. loop

Once an audiovisual aid has been stored within a container file, a _____ is required to decode and play that content. a. bitmap b. command prompt c. media player d. clipboard

Ria is creating a website that includes videos. She wants to apply subtitles to the video clip and arrange the text horizontally within the cue. Which of the following cue attributes should she include in the code to accomplish this? a. position:value b. line:value c. align:value d. size:value

Ryan wants to embed the audio clip within the page, but he does not want the browser's native media player to show up. Which of the following HTML audio and video element attributes will help Ryan accomplish this? a. autoplay b. loop c. controls d. preload

The default browser style for header cells is to display the text of the header in bold font and _____ within the cell. a. left-aligned b. right-aligned c. centered horizontally d. positioned vertically

Which of the following HTML elements is used to create header cells in a web table? a. <tr> b. <td> c. <th> d. <head>

Which of the following can Oscar use to display a list of makes and models of skateboards? a. Text area boxes b. Radio buttons c. Selection lists d. Slider controls

Which of the following is true of the plug-in approach to deliver multimedia content? a. A common plug-in is available across all browsers, operating systems, and devices. b. Plug-ins are reliable and secure. c. A plug-in requires users to install a separate application in addition to their web browsers. d. Plug-ins consume valuable system resources, resulting in fast and reliable performance.

Which of the following styles sets the column breaks within paragraphs to leave a minimum of two and three lines at the top and bottom of each column respectively? a. article p { break-before: always; } b. article p { break-before: always; } c. article p { orphans: 3; widows: 2; } d. article p { break-inside: auto; }

Which of the following timing-function keywords allows a transition to occur at a constant rate and then slow down toward the end? a. alternate-reverse b. linear-backwards c. ease-out d. ease-in-out

In HTML, to specify the caption location for a web table the _________ property is used.

caption-side

Identify a CSS property to place a table caption.

caption-side: position;

It is a brief text description that is synced to specified time points within the media clip.

captions

Oscar wants the web form to allow users to select the delivery date for the items he purchases. To select the dates, Oscar should use a _____.

check box

A check box can be selected automatically by adding the _________ attribute to the input element.

checked

Which of the following is true of class in the table tag <table class=" ">?

class is an attribute.

In _________ borders model, borders from adjacent elements are merged together to form a single border in a new style that combines features of both the borders.

collapsed

The number of colors supported by an output device.

color-index

The _____ attribute is added to a <td> element to create a cell that spreads across several cells vertically.

colspan

Which of the following HTML attributes is used to create a single cell that occupies more than one cell from a series of horizontal cells?

colspan

Luis has created a table to include the definitions of manufacturing tools used in the industry. He wants to add a space between each column cell of the definition for better understanding. Identify a property that Luis should include in the code to fulfill the requirement.

column-gap;

Identify an attribute that can be added to the input element to validate a text value against a regular expression. a. legend="text" b. method="text" c. enctype="regex" d. pattern="regex"

Identify the grouping element which contains an illustration, photo, diagram, or similar object that is cross-referenced elsewhere in a document.

figure

Luis has created a web page for a textile industry. When viewing the web page on a different computer, Luis notices a difference in the web page layout. So he decided to make changes in the code to make the layout suitable on all computers. Luis has created a table to include the definitions of manufacturing tools used in the industry. He wants to add a space between each column cell of the definition for better understanding. Identify a property that Luis should include in the code to fulfill the requirement.

column-gap;

Identify a property that is used to separate one column from the next using graphic dividing line.

column-rule

Which of the following properties prevents the spanning of content across all the columns?

column-span: none;

Identify a style property that creates a column size of 200-pixels.

column-width

A _________ is a button that runs a program, which affects the content of the page or the actions of the browser.

command button

utf (unicode transformation format)

compressed format that allows computers to display and manipulate text.

To insert the information of the data-label attribute directly before the data cell value, the _____ property is used.

content

While designing websites for mobile devices, _____ colors should be used so that pages are easily visible in outdoor lighting.

contrasting

A form contains _____, also called widgets, which are the objects that allow the user to interact with the form.

controls

Sam is trying to decide the best way to design the background of his web page. He would like to add background images and background styles to his design. He needs to understand how browsers load a background image and learn about background style properties. Sam needs to know how to tell the browsers to scale the image in order to cover all of the background while still retaining the proportions of the image, even if that means cropping the image. The keyword Sam should use in the background-size: property is _____.

cover

JavaScript is used as a programming tool for:

creating interactive web forms and animated graphics.

In the context of a flexible box, perpendicular to the main axis is the _____, which is used to define the height or width of each item.

cross axis

A host that provides storage space for saving and retrieving records is called a _____.

file server

Ryan wants to embed an audio clip within the web page he is creating. Which of the following snippets must he include to embed an audio element in the web page along with the source and the type files? a. <audio controls> <source src="cp_overture.wav" type="audio/ogg"/> </audio> b. <audio controls> <source src="cp_overture.ogg" type="audio/.mp4"/> </audio> c. <audio controls> <source src="cp_overture.m4a" type="audio/ogg"/> </audio> d. <audio controls> <source src="cp_overture.aac" type="audio/mp4"/> </audio>

The cue attribute _____ sets the width of a cue as the percentage of the width of a video window. a. position:value b. line:value c. align:value d. size:value

The value of the kind attribute that provides long explanations synced to specified time points within a media clip is _____. a. metadata b. captions c. srclang d. descriptions

The video codec used for the Ogg video format is _____. a. H.264 b. VP9 c. Truespeech d. Theora

Which of the following is true of a transition? a. It is a quick and instantaneous process and does not involve any steps in between to provide the styles. b. It is an event initiated automatically by a browser. c. It retains an object's style from the initial state till the ending state. d. It slows down the change to an object's style and provides intermediate styles.

Which type of field should Wyona provide for the user to provide plenty of space for customers to enter the information for a custom pattern? a. Input boxes b. Check boxes c. Spin boxes d. Text area boxes

In HTML5, _________ is an attribute that stores the data labels or customized data.

data attribute

In the given figure, the items marked Box A and Box B are the _____ respectively.

data cells and column cells

A data entry control is associated with a _____ in which data values supplied by the user are stored.

data field

Using the CSS _________ property, a table layout is applied to other HTML elements such as paragraphs, block quotes, or list.

display

When the width of an entire table is set to be larger than the width required for individual columns, the extra space is _____.

divided equally among the columns

The _____ loop tests the condition to continue the loop right after the latest command block is run.

do/while

The first line in a Hypertext Markup Language (HTML) file is the _____, which is a processing instruction indicating the markup language used in a document.

doctype

Alt

document type used to support frames

Since a page can contain multiple web forms, JavaScript organizes the forms into _____ object collection.

document.forms[idref]

Identify an expression that can be used to refer an element by its id attribute.

document.getElementById(id)

When a hover event is used to hide an object or display it, mobile browsers employ a _____ event.

double-tap

When submenus overlay page content, a(n) _____ should be added so that when a submenu is opened, it will stand out more from the page content.

drop shadow

Another type of pseudo-class is _____ pseudo-class in which the class can change state based on the actions of a user.

dynamic

Grouping dozens of different fields into a _________ that a web form can have, makes the form easier to interpret and more accessible.

field set

Some designers propose the use of _____ in which all measurements are expressed relative to the default font size using the em unit.

elastic layouts

Identify an attribute selector that selects all elem elements whose att attribute begins with text.

elem[att^="text"]

Identify a Cascading Style Sheets (CSS) selector that is used to select pseudo-elements.

element::pseudo-element

The _____ is a possible media type value for the media attribute.

embossed

The _____ media type value for the media attribute is used for paged Braille printers.

embossed

Specifies how the form data should be encoded as it is sent to the server

enctype

Used to append the form data to the end of the URL

get

The _____ element, a Hypertext Markup Language (HTML) metadata element, contains a collection of metadata elements that describe the document or provide instructions to the browser.

head

The two types of table cells supported by web tables are _____.

header cells and data cells

The _____ value of the overflow style keeps the element at a specified height and width, but cuts off excess content.

hidden

Used to create an email field that is part of the form but not displayed

hidden

A mobile browser will interpret a _____ event as a tap event in which a user taps a page object.

hover

Identify a grouping element that marks a thematic break such as a scene change or transition to a new topic.

I just found this out.

http://st3w.ivc.edu/msalviani/CIM141-sp2018/rmedina22/

T4 Case Problem 2: Save Your Fork

http://st3w.ivc.edu/msalviani/CIM141-sp2018/rmedina22/fork/ ------------------------------------------ @charset "utf-8"; /* New Perspectives on HTML5 and CSS3, 7th Edition Tutorial 4 Case Problem 2 Save your Fork Graphic Design Styles Author: Date: Filename: sf_effects.css */ /* Body Header Styles */ body { box-shadow: rgb(51, 51, 51) 10px 0px 50px, rgb(51, 51, 51) -10px 0px 50px; } /* Navigation Tabs List Styles */ body > header nav.tabs { background-image: url(sf_back1.png); background-repeat: no-repeat; background-size: cover; background-position: center; } body > header nav.tabs li{ transform: perspective(50px) rotateX(20deg); } nav.tabs a:hover, nav.tabs a:active { background-color: rgb(231, 231, 231); } /* Left Section Styles */ section#left nav.vertical { border: 1px solid rgb(20,167,170); border-radius: 25px; } section#left nav.vertical h1{ border-radius: 25px 25px 0px 0px; } /* Center Article Styles */ section#center article { background: radial-gradient(white, 30%, rgb(151,151,151)); border: 1px solid rgb(151, 151, 151); border-radius: 50px; box-shadow: rgb(51,51,51) 10px 10px 20px; } /* Blockquote Styles */ section#right blockquote{ background-image: url(images/sf_speech.png); background-repeat: no-repeat; background-position: center; background-size: 100% 100%; filter: drop-shadow(5px 5px 10px rgb(51, 51, 51)) } section#right cite img{ border-radius: 50%; }

T5 Case Problem 2: Willet Creek

http://st3w.ivc.edu/msalviani/CIM141-sp2018/rmedina22/willet/

What is the output of the following code? for(var i = 5; i > 0; i--)

i = 5, 4, 3, 2, 1

Any style that is applied to the thead, tbody, or tfoot element is _________ by the rows those elements contain.

inherited

By default, browsers display input boxes as _____ elements with a default length of 20 characters.

inline

The technique of immediate data validation and reporting of errors is known as _____.

inline validation

The _____ element is used to mark the form controls that are designed to receive user responses.

input

The check box control is created using the _____ element.

input

In z-index: value; property, value is a(n) _____.

integer

An alternative to direct testing of mobile interfaces on all mobile devices is the use of _____.

mobile device emulators

Identify a generic font group that is a typeface in which each character has the same width.

monospace

The format used when uploading files in which no encoding of the data values occurs

multipart/form-data

This attribute specifies that the audio output should be suppressed.

muted

A common technique for mobile websites is to hide navigation menus but to indicate their presence with a(n) _________, which is a symbol usually represented as three horizontal lines.

navicon

Identify the default clear value that allows an element to be displayed alongside any floated objects.

none

It is used to create an inflexible item that will not grow or shrink.

none

The _____ value of the display style removes an element from a rendered page.

none

The _________ operator negates any feature found in an expression.

not

This operator negates any features found in an expression.

not

The Flash player can act as a fallback for older browsers that do not support HTML5 by nesting the _________ element within the audio or video element.

object

The _________ element, which replaced the embed element, is used for any type of content such as sound, video clips, graphic images, PDF files, and even the content of other web pages.

object

Objects are organized into groups called _____.

object collections

Page breaks within block elements can often leave behind _____, which is a text fragment left at the bottom of a page.

orphans

A page box is composed of a _____, which contains the content of a document.

page area

In Cascading Style Sheets (CSS) every printed page is defined as a _____.

page box

Once a page name is defined, the content of an element will appear on its own page, with the browser automatically inserting _________ before and after the element if required.

page breaks

declaration

part of the style statement that identifies how elements should appear.

A _________ is a software program accessed by a browser to provide a feature or capability nonnative to the browser.

plug-in

This attribute is applied to the video element to define a video's preview image.

poster

progressive enhancement

*background-clip:* what does? Keywords (3)?

property defines how far the background (color or image) should extend within an element. 1) background-clip: border-box Default value. The background extends behind the border 2) background-clip: padding-box The background extends to the inside edge of the border 3) background-clip: content-box The background extends to the edge of the content box https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_background-clip

*background-position:* what does? Keywords (5) and values (2)? Order of values? *According to which point the image is moved?*

property sets the starting position of a background image 1) background-position: top | bottom | left | right | center Keywords could be used *two in conjunction* or If you only specify one keyword, the other value will be "center" 2) background-position: x% y% The top left corner is 0% 0%. The right bottom corner is 100% 100%. If you only specify one value, the other value will be 50%. 3) background-position: xpos ypos If you only specify one value, the other value will be 50%. *You can mix % and positions* *Note:* The first value is the horizontal position and the second value is the vertical. *Note2:* The image is moved according to the middle point. (only in percentages). For px it is top left corner. https://www.w3schools.com/cssref/pr_background-position.asp

color

property that lets you change the color of various items on a webpage.

Inline styles are styles applied directly to specific elements using the style attribute<element style="property: value"> content </element>where element is the Hypertext Markup Language (HTML) element and _____ defines the styles that are applied directly to that element.

property: value

The problem wherein the user needs to scroll vertically down the web page to view information on a mobile device can be resolved by using _____.

pulldown menus

For the AllStyles's main web page, Alex creates a navigation bar that includes topical areas named Clothing, Accessories, and About Us. Alex wants to create nested lists within each of these topical areas that would contain links to specific pages on the AllStyles website. In order to do so, Alex must _____ while writing the HTML code.

put each of the nested lists within a class

Identify a data type applied in an input element to create slider controls.

range

The coordinates for the section element need not be defined as long as its position is set to _____.

relative

While creating a website for tablet design, to keep the submenus in their current position on a page, one needs to make each main list item a container for its submenu by setting its position property to _____.

relative

The _____ attribute must be added to the control to identify whether the data has been supplied to those fields that are opposed to the ones that are optional.

required

HTML supports the _____ attributes to set the text area size.

rows and cols

style

rule that defines the appearance of an element

A _____ occurs after a script has been successfully loaded with no syntax errors and is being executed by a browser.

run-time error

Identify a method that is used to create a subarray.

slice()

It is nested within a single audio section to provide several versions of the same media file.

source element

Jenny wants to distribute the flex items in the magazine's website evenly with the first and last items aligned with the start and end of the main axis. Identify the keyword Jenny must assign to value in the align-content: value; property.

space-between

When a cell _________ multiple rows or columns, it pushes other cells to the right or down in a table.

spans

In the accompanying figure, Box E represents a _____.

spin box

A _____ is used to restrict numeric values by displaying an up or down arrow to increase or decrease the field value by a set amount.

spinner control

When a doctype is present, browsers will render the page in _____ mode, employing the most current specifications of Hypertext markup Language (HTML).

standards

property

style applied to a declaration.

An additional factor in how an element is rendered is that properties are passed from a parent element to its children in a process known as _____.

style inheritance

embedded style sheet

style sheet is added within the head tags of the HTML documents to define the style of a webpage.

The _________ property value of fixed tells the browser to ignore cell content when reducing the width of the table columns.

table-layout

<meta>

tag that has several functions but is used to declare the character incoding utf-8

In the given figure, identify the row group element Box A.

tbody

Data cells that do not function as headers for table rows or columns are marked using the _____ element.

It is used to mark table cell content that is not the head of a row or column.

td element

Which of the following CSS properties is used to align the caption text horizontally?

text-align

The format in which data is transferred as plain text with spaces replaced with the + character, but no other encoding of the data values occurs

text/plain

When a style for a table element is created by setting the font color to red, _____.

the caption text will be displayed in the same color as the previous table

In the given figure, Box A refers to _____.

the second cell in rows two and three that spans seven columns

Identify the three row groups supported by HTML.

thead, tbody, and tfoot

Which of the following can be used to express value in the outline-width property outline-width: value;?

thick

The process of ensuring that the user has supplied correct data is called _____.

validation

It is used to move the cell text in a table.

vertical-align property

Web pages are seen within a window called the _____.

viewport

Most mobile and tablet devices do not have physical keyboards; instead, they use _________ that exist as software representations of the physical device.

virtual keyboards

Mobile devices have a _________ viewport that displays a web page content that fits within a mobile screen.

visual

When a hover event is used to hide an object or display it, mobile browsers employ a _____ event.

double-tap

Page breaks within block elements can often leave behind _____, which is a fragment of text left dangling at the top of page.

widows

It a line of text placed at the top of a column.

widows property

Identify an attribute selector used to select an element based on its class value.

elem.class

To specify a stacking order, one can use the _____ property.

z-index

In the hexadecimal numbering system, the number 16 is expressed as _____.

In the hexadecimal numbering system, the number 21 is expressed as _____.

Tablet layouts are based on grids of _____ columns.

4 to 12

Which of the following class names is used to indicate a column with a width of 25%?

Which of the following HTML tags is used to set the width of a table border?

_____ is the tint of a color and is usually represented by a direction on a color wheel.

Hue

_____ measures the brightness of a color and ranges from 0% (black) up to 100% (white).

Lightness

_____ are used to associate a style sheet or style rule with a specific device or list of device features.

Media queries

_____ defines how solid a color appears.

Opacity

_____ units express font size according to the size of other objects within a web page.

Relative

_____, a principle of design, is the repetition or alternation of a design element in order to provide a sense of movement, flow, and progress.

Rhythm

_____ measures the intensity of the chosen color and ranges from 0% (no color) up to 100% (full color).

Saturation

_____ selectors are used to select elements based on elements that are adjacent to them in the document hierarchy.

Sibling

Identify a relative unit in which lengths are expressed as a percentage of the width or height of a browser window.

Viewport unit

Each hotspot within the map element is defined using the _____ element.

area

Which of the following is a default value for border-collapse property?

border-collapse: separate;

Scott works for an online retailer and has to format the border around each element on their web page. He has to set the border design and the border color for each element. He needs to understand how the appearance and color of the border can be defined. Scott wants to use the color gray for the top and left borders and black for the right and bottom borders for an element. Which of the following should he use to define this?

border-color: gray black black gray;

To round off any of the four corners of a border, the _____ property should be applied.

border-radius

Scott wishes to modify the combination of the borders used on an element. He wants to use a double line for the top/bottom borders and a single solid line for the left/right borders. Which of the following border styles should he use?

border-style: double solid;

Identify the property that is used to choose the layout model.

box-sizing

The _____ attribute is added to a <td> element to create a cell that spreads across several cells vertically.

colspan

Identify a property that is used to separate one column from the next using graphic dividing line.

column-rule

Identify a style property that creates a column size of 200-pixels.

column-width

Decorative opening and closing quotation marks can be inserted using the _____ property.

content

Which of the following coordinate values is used to define polygonal hotspots for an image?

coords="x1,y1,x2,y2,..."

Sam is trying to decide the best way to design the background of his web page. He would like to add background images and background styles to his design. He needs to understand how browsers load a background image and learn about background style properties. Sam needs to know how to tell the browsers to scale the image in order to cover all of the background while still retaining the proportions of the image, even if that means cropping the image. The keyword Sam should use in the background-size: property is _____.

cover

Each child element may contain children of its own and so forth down the hierarchy, creating a set of _____ elements that are all descended from a common parent.

descendant

Sam is trying to decide the best way to design the background of his web page. He would like to add background images and background styles to his design. He needs to understand how browsers load a background image and learn about background style properties. Sam wants the browser to load a background image and repeat the image in both the vertical and horizontal directions until the background is filled. This process is known as _____.

tiling

Identify the syntax of the transform property.

transform: effect(params);

Which of the following list styles should be applied to the ol element to display an unordered list with markers as shown below? Home Getting Started Scrapbooking Tips Supply List

ul {list-style-type: disc;}

Page breaks within block elements can often leave behind _____, which is a fragment of text left dangling at the top of page.

widows

See all study sets

HTML and CSS Final Study Guide version 3

Related study sets

Yellow Belt Examination

test

Computer Audit Exam 1

Communicating at Work Ch 1 LS/SB

bcor 350 exam 4 chapter 7

Chapter 11: DNA Biology

Chapter 4: Equilibrium: Where Supply Meets Demand

Behavior Modification

Primul Război Mondial

Ectoderm I: Neural Tube Formation

Biochemistry

International Econ test 1

Missed Q-Bank Question Terms

Electrical Machines Midterm-Theory

Steps to chemiosmosis

MATH 120 - Quiz 4 (2.4-2.5)

States and Changes of Matter Unit Test 100%

IVT

Science Planets and 6.8a

Nursing 325 Week 5