Web Dev Exam 2

Chapters 3-4

Which of the following coordinate values is used to define polygonal hotspots for an image?

-coords=”x1, y1, x2, y2…”

-coords=”0, 0, width, height”

-coords=”left, top, right, bottom”

-coords"=”x, y, radius”

coords=”x1, y1, x2, y2…”

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

-liquid layouts

-fixed layouts

-fluid layouts

-elastic layouts

elastic layouts

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

-background-repeat: type;

-background-image: url(url);

-background-attachment: type;

-background-clip: type;

-background-repeat: type;

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

True

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

-border-width

-border-radius

-border-style

-border-image

border-radius

The sizing keyword cover tells the browser to automatically set the width or height value based on the dimensions of the original image.

False

A _____ sets the width of page elements as a percent of the available screen width.

-fixed layout

-standard layout

-fluid layout

-stationary layout

fluid layout

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

False

Shadows can be added to any block element in a web page by using the text-shadow property.

False

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

-first line

-hyperlink

-first letter

-ridge

first letter

Which of the following statements is true of outline styles?

-An outline does not surround an entire element

-There are separate outline styles for the left, right, top and bottom edge of an object

-An outline adds values to the width and height of an object

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

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

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

Which of the following properties are useful when a web designer wants to use CSS to center an entire layout within the web page in both the horizontal and vertical directions?

-align-items: center;

justify-items: center;

-align-self: center;

justify-self: center';

-align-content: space-around;

justify-content: space-around;

-align-content: center;

justify-content: center;

align-content: center;

justify-content: center;

Identify a true statement about grids:

-new content can’t be placed within a grid as it will be inconsistent with previously entered information

-grids slow down the development process for establishing systematic framework for a page layout

-Grids add order to the presentation of page content without adding any visual rhythm

-A well-designed grid is more easily accessible for users with disabilities and special needs

A well-designed grid is more easily accessible for users with disabilities and special needs

The sizing keyword auto tells the browser to resize and image to cover all the element background while still retaining the image proportions.

False

Which of the following can be used to express style in the outline-style property outline-style: style;

-thin

-thick

-ridge

-medium

ridge

Identify a CSS3 2D transform function that moves an object to the right or left, depending on whether the value provided to it is positive or negative

-matrix(n, n, n, n)

-skew Y(angles)

-translate X(off X)

-translate Y(off Y)

translate X(off X)

Whether an element is displayed as a block or as inline depends on the style sheet

True

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

True

Elliptical corners can be created by specifying the ratio of the horizontal radius to the vertical radius using the border-radius style

true

A linear gradient is a color gradient that starts form a central point and proceeds outward in a series of concentric circles

False

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

-translate3d (off X, off Y, off Z)

-perspective (p)

-rotate3d(off X, off Y, off Z, angle)

-scale3d (off X, off Y, off Z)

translate3d (off X, off Y, off Z)

Identify the style that should be applied to remove clipping complete from an element

-clip: none

-clip: hidden

-clip: left

-clip: auto

clip: auto

Tablet layouts are based on grids of ____ columns

-4 to 12

-1 to 3

-0

-12 or more

4 to 12

Which of the following CSS 3 filters applies transparence to an image?

-blur

-invert

-grayscale

-opacity

opacity

Which of the following style rules is used to draw a 1px red dotted line around every element on a web page?

-*{outline: 1px dotted red;}

-*{outline-style: 1px dotted red;}

-*{outline-style= “1px dotted red”}

-*{outline: 1px, red, dotted;}

*{outline: 1px dotted red;}

Even if the background images are hidden, the tiling process continues behind the page body

True

By default, an element’s background is defined to extend only through the padding space and not to include the border space

True

Each hotspot within the map element is defined using the ___ element

-header

-article

-space

-area

area

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

false

In the radial-gradient function, the default is to place the gradient within the center of a background true or false

true

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

False

Which of the following properties centers the content of a CSS grid cell horizontally and positions it with the bottom edge of the cell?

-align-items: end;

justify-items: center;

-align-items: center;

justify-items: end;

-align-items: end;

justify-items: stretch;

-align-items: bottom;

justify-items: center;

align-items: end;

justify-items: center;

Identify a property that a browser can use to handle excess content

-clip

-article

-overflow

-border

overflow

Identify a true statement about the figcaption element:

-it is the content that will appear within a figure box

-it is a required element

-it is placed either directly before or directly after a figure box’s content

-it is used to mark any page content to make it stand apart from the main content of an article

-it is placed either directly before or directly after a figure box’s content

Slices of different widths or heights can be created by entering the size values in a comma-separated list

false

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

false

____ positioning is essentially the same as not using any CSS positioning at all

-static

-relative

-absolute

-elastic

static

Browsers ignore any values specified for the left or top properties under ____ positioning

-absolute

-static

-elastic

-inherited

static

Setting the display style to none hides an element but doesn’t remove it from the page flow; that is, it still occupies the same space in the page

false

The only requirement for a repeating gradient is that a stopping position is required for the first color in the list that is less than the size of the object background

false

The ___ size parameter of the radial-gradient function makes a gradient extend to the nearest background corner

-corner-side

-closest-corner

-side-corner

-farthest-corner

closest-corner

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

-scroll

-visible

-auto

-hidden

auto

Identify a grid-based style whose value is a space-separated list of column widths

-grid-template-row

-grid-template-column

-track-list

-inline-list

grid-template-column

The width of the line used in an outline is defined by the outline-style property

false

Which of the following is the default overflow property?

-visible

-hidden

-scroll

-auto

visible

A fluid layout is one in which the size of a web page and the size of the elements within are set regardless of the screen resolution

false

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

-border-width: left;

-border-side-width: width;

-border-width: width;

-border-width-style: thick;

border-side-width: width;

Ken has built a website for his assignment. He has created a blue background image for each link that appears on the site. Also each link appears in green without underlines. Which of the following styles has Ken most likely used to remove the underline from links?

-text-format

-text-decoration

-text-align

-text-font

text-decoration

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

-auto

-scroll

-hidden

-visible

hidden

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

-positive values along the axes are to the right, down, and away from a reader

-positive values are along the axes are to the left, up, and away from a reader

-negative values along the axes are to the right, down, and toward a reader

-negative values along the axes are to the left, up, and away from a reader

negative values along the axes are to the right, down, and toward a reader

A value of auto for the overflow property instructs browsers to increase the height of an element to fit the overflow content

false

If an object within a browser window has to be fixed so that it doesn’t scroll, the web designer can set its position property to fixed

true

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?

-space

-round

-local

-fixed

local

The ____ property allows one to define a rectangular region through which an element’s content can be viewed

-crop

-static

-auto

-clip

clip

Once a CSS grid is established, a specific element within a ____ is placed at the intersection of a specified row and column

-stack

-grid cell

-sibling element

-track-list

grid cell

The width property of the ____ model is based on the sum of the content, padding, and border spaces and any space taken up by the padding and border is subtracted from space given to the content

-border box

-padding box

-content box

-margin box

border box

the ___ value of the display style removes an element from a rendered page

-null

-none

-empty

-hide

none

The z-index property stacks overlapping objects with the highest z-index value on top of the others

true

Identify the syntax of the transform property

-transform: effect(params);

-transform: horizontal vertical;

-transform: radius;

-transform: size shape at position;

ransform: effect(params);

Centering an element vertically within a parent element is easily accomplished as the height of the parent element is defined by a value true or false

false

Within the CSS grid model, gridlines are numbered___

-starting with 0 and increasing in value down and across the grid

-so that the first gridline is assigned a value of 1 and the last is assigned a value of -1

-starting with 1 at the bottom-right corner for positive values

-horizontally but not vertically

so that the first gridline is assigned a value of 1 and the last is assigned a value of -1

The default direction for a linear color gradient is horizontal, starting from the left of an object and moving to the bottom true or false

false

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

-fluid layout

-fixed layout

-liquid layout

-stationary layout

fixed layout

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

-background-repeat: type;

-background-image: url(url);

-background-attachment: type;

-background-clip: type;

background-clip: type;

Identify the option that defines how positions are measured on the background in the following background property: background: color url(url) position / size repeat attachment

-size

-origin

-clip

-attachment

origin

Rhythm is the ability to combine different design elements into a cohesive whole

false

When defining the number and size of grid columns, you can use the keyword___ to allow the column width to be automatically set by the browser

-thin

-thick

-auto-fill

-auto

auto

To change the shadow size, the ___ parameter must be added to the box-shadow property, specifying the size of the shadow relative to the size of the object

-round

-space

-stretch

-spread

spread

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

-coords=”x1, y1, x2, y2,…”

-coords=”0, 0, width, height”

-coords=”left, top, right, bottom”

-coords=”x, y, radius”

-coords=”0, 0, width, height”

Which of the following shape values represents the remaining area of an inline image not covered by any hotspots

-default

-circle

-rect

-poly

default

Identify the default type for the background-repeat style

-no-repeat

-repeat

-repeat-x

-repeat-y

repeat

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

true

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

true

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

false

When a rectangular region is defined using an approrpiate style, which value matches the specified edge of the clipping region to the edge of the parent element

-right

-default

-auto

-left

auto

A(n)___supersedes a browser’s default styles and provides a consistent starting point for page design

-elastic layout

-content box

-fixed grid

-reset style sheet

reset style sheet

box shadows can only be placed outside an element

false

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

false

Identify the option that specifies whether an image scrolls with the content or is fixed in the following background property: background: color url(url) position / size repeat attachment origin clip;

-position

-origin

-clip

-attachment

attachment

____, a principle of design, is the repetition or alteration of a design in order to provide a sense of movement, flow, and progress

-unity

-balance

-rhythm

-emphasis

rhythm

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

false

Fractional units are often combined with absolute units to create grid layouts that are both fixed and flexible

true

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

true

the ___ unit can be thought of as a share of available space

-wbr

-em

-fr

-grid-template

fr

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

-none

-left

-right

-middle

none

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

false

Clipping can only be applied when an object is placed using ____ positioning

-absolute

-static

-relative

-fixed

absolute

The Yacht club’s website contains 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, The web designer needs some help with CSS to make sure the pages display correctly. Which display value would work best to prevent the pictures from displaying when the web page loads?

-inherit

-run-in

-block

-none

none

Which properties will extend a grid item so that it covers multiple rows and columns, specifically the area from row gridlines 3 to 5 and from column gridlines 1-3?

-grid-row 3/5;

grid-column: 1/3;

-grid-row 2/4;

grid-column: 4;

-grid-column-start 3;

grid-column-end: 5;

-grid-column-start-end 1/3;

grid-column-start-end: 3/5;

-grid-row 3/5;

grid-column: 1/3;

Which expression extends a grid item across an entire CSS grid row from the first gridline to the last?

-grid-row: 1/-1;

-grid-row: -1/1;

-grid-column: 1/-1;

-grid-column: -1/1;

grid-row: 1/-1;

A final way to alter an object is through a CSS ___

-filter

-box model

-border property
-visual design style

filter

When a CSS element is displayed as a grid, the direct child elements nested within it___

-remain outside of the grid structure

-are considered block-level elements

-can be floated, whereas the entire grid cannot be

-become grid items

become grid items

The background-position property is only useful when non-tiled images because a tiled image fills the background and it usually doesn’t matter where the tiling starts

true

All block elements, like the body element, have a default width of___

-50%

-150%

10%

-100%

100%

Identify the property that is used to apply a border image

-border-image: horizontal/vertical;

-border-image: style;

-border-image-radius: radius;

-border-image: url(url) slice repeat;

border-image: url(url) slice repeat;

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

-it is used to mention the shadow color

-it is used to measure the distances of the shadow from the text in horizontal and vertical directions

-it is used to define the amount by which the shadow is stretched

-it is used to create an interior shadow

it is used to create an interior shadow

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

true

An element with the display type value ____ is displayed as a block unless its next sibling is also a block, in which case, it is displayed inline, combining the two blocks into one

-block

-run-in

-none

-inline

run-in