New Perspectives on HTML5, CSS3, and JavaScript 6th Edition by Patrick M. Carey - Test Bank

New Perspectives on HTML5, CSS3, and JavaScript 6th Edition by Patrick M. Carey – Test Bank

 

Instant Download – Complete Test Bank With Answers

 

 

Sample Questions Are Posted Below

 

True / False

1. 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.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 344
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

2. While designing web pages for mobile devices, the overall file size should be kept small.
a. True
b. False
ANSWER: True
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 344
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

3. Viewing a web page on a mobile device gives the same experience as viewing the same web page on a desktop computer.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 344
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

4. 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.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 345
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

5. When no media attribute is used, a style sheet is assumed to apply to all devices accessing the web page.
a. True
b. False
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 346
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

6. 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.
a. True
b. False
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 347
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

7. The media feature orientation accepts min- and max- prefixes.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 348
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

8. With responsive design, it is easier to replace styles than to add new styles.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 350
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

9. Desktop computers have two types of viewports: a visual viewport and a layout viewport.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 352
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.02 – Work with the browser viewport
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Viewports and Device Width
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

10. 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.
a. True
b. False
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 352
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.02 – Work with the browser viewport
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Viewports and Device Width
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

11. One of the key components while creating a mobile website design is to have the most important information up-front and easily accessible.
a. True
b. False
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 355
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

12. An individual cannot use only the ul.submenu:hover selector because one cannot hover over the submenu until it is visible.
a. True
b. False
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 358
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

13. A flexbox is a box containing items whose sizes are fixed.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 374
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

14. Different items within a flexbox can have different growth rates.
a. True
b. False
ANSWER: True
POINTS: 1
QUESTION TYPE: True / False
HAS VARIABLES: False
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

15. Order values for flexboxes cannot be negative.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 389
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Reordering Page Content with Flexboxes
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

16. The align-items property is only impactful when there are multiple lines of flex items.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 393
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.07 – Explore flexbox layouts
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Flexbox Layouts
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

17. The default style of browsers to format the print versions of the web pages they encounter always result in the best printouts.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 403
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.08 – Create a print style sheet
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Designing for Printed Media
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

18. The styles applied to a page box using the @page rule are limited to defining the page size and the page margin.
a. True
b. False
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 405
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

19. By default, the @page rule is applied only to the first page of the printed output.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 406
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

20. A page name should be created to define styles for the first, left, and right pages.
a. True
b. False
ANSWER: False
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 406
QUESTION TYPE: True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

Modified True / False

21. 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.
ANSWER: False – horizontal
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 344
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

22. The tty media type is used for television-type devices with low resolution, color, and limited scrollability.
ANSWER: False – tv
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 346
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

23. The most appropriate sizing unit for television devices is the use of points.
ANSWER: False – print, printing
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 346
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

24. The @media and @import rules employ similar syntax.
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 347
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

25. Widths in media queries are based on the width of the visual viewport.
ANSWER: False – layout
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 352
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.02 – Work with the browser viewport
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Viewports and Device Width
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

26. 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.
ANSWER: False – second
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 359
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

27. An important aspect of mobile design is optimizing a site’s performance under static network conditions.
ANSWER: False – varying
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 361
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

28. By default, flexbox items are arranged vertically.
ANSWER: False – horizontally
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 375
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

29. The growth value of flex items defines the initial size of an item before a browser attempts to fit it to the flexbox.
ANSWER: False – basis size
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 377
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.06 – Work with flex sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Flex Items
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

30. 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.
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 380
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.06 – Work with flex sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Flex Items
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

31. A flex item cannot itself be a flexbox for its child elements.
ANSWER: False – can
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 385
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.07 – Explore flexbox layouts
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Flex Items
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

32. Both the align-content and align-items properties have a default value of center.
ANSWER: False – stretch
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 393
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.07 – Explore flexbox layouts
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Flexbox Layouts
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

33. When a user hovers or touches a navicon, the navigation menu is revealed.
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 394
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Navicon Menu
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

34. 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.
ANSWER: False – normal
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 412
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

35. 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.
ANSWER: True
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 415
QUESTION TYPE: Modified True / False
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.10 – Add and remove page breaks
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Page Breaks
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

Multiple Choice

36. While designing websites for mobile devices, _____ colors should be used so that pages are easily visible in outdoor lighting.
a. contrasting
b. red and blue
c. darker
d. lighter
ANSWER: a
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 344
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

37. 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.
a. contrasting colors
b. responsive images
c. flexible layout
d. media queries
ANSWER: c
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 345
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

38. _____ are used to associate a style sheet or style rule with a specific device or list of device features.
a. Flexible layouts
b. Responsive images
c. Viewports
d. Media queries
ANSWER: d
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 345
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

39. 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” />
ANSWER: c
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 346
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

40. The _____ is a possible media type value for the media attribute.
a. flexi
b. embossed
c. lnk
d. view
ANSWER: b
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 346
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

41. The _____ media type value for the media attribute is used for paged Braille printers.
a. braille
b. embossed
c. handheld
d. screen
ANSWER: b
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 346
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Moderate
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

42. 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
}
ANSWER: c
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 346
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

43. 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;
ANSWER: a
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 347
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

44. 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)”
ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 347
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

45. The _____ is a device feature that gives the ratio of the width of the display area to its height.
a. index-ratio
b. display-ratio
c. aspect-ratio
d. orientation-ratio
ANSWER: c
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 347
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

46. 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
}
ANSWER: a
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 348
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

47. Multiple media features can be combined using _____.
a. real-time operators
b. logical operators
c. relational operators
d. dimensional operators
ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 348
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

48. 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
}
ANSWER: a
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 348
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

49. For older browsers that do not support media queries, Cascading Style Sheets (CSS) 3 provides the _____ keyword to hide style sheets from those browsers.
a. initial
b. none
c. only
d. auto
ANSWER: c
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 348
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

50. Web pages are seen within a window called the _____.
a. wireframe
b. navigator
c. prototype
d. viewport
ANSWER: d
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 352
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.02 – Work with the browser viewport
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Viewports and Device Width
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

51. Mobile devices have a _____ containing the entire content of the page, some of which may be hidden from a user.
a. layout viewport
b. navigating viewport
c. wireframe viewport
d. contextual viewport
ANSWER: a
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 352
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.02 – Work with the browser viewport
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Viewports and Device Width
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

52. 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 _____.
a. pulldown menus
b. navigation viewports
c. horizontal wireframes
d. contextual data
ANSWER: a
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 355
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

53. 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
ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 357
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

54. A mobile browser will interpret a _____ event as a tap event in which a user taps a page object.
a. block
b. compilation
c. selection
d. hover
ANSWER: d
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 359
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

55. When a hover event is used to hide an object or display it, mobile browsers employ a _____ event.
a. double-tap
b. compilation
c. selection
d. highlight-text
ANSWER: a
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 359
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

56. 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.
a. first tap
b. second tap
c. title toolbar
d. texting event
ANSWER: a
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 359
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

57. An alternative to direct testing of mobile interfaces on all mobile devices is the use of _____.
a. mobile device spurs
b. mobile device synchronizers
c. mobile device emulators
d. mobile device initiators
ANSWER: c
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 359
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

58. 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 _____.
a. display the submenus one after the other
b. float the submenus side-by-side
c. reduce the width of the submenu display bars
d. partially overlap the submenu titles
ANSWER: b
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 363
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Tablet Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

59. To make the submenus in a tablet device overlay the page content, the submenus should be placed with _____.
a. relative positioning
b. z-index positioning
c. incremental positioning
d. absolute positioning
ANSWER: d
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 365
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Tablet Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

60. 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 _____.
a. relative
b. actual
c. logical
d. absolute
ANSWER: a
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 365
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Tablet Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

61. 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.
a. relative element
b. drop shadow
c. logical tag
d. absolute position
ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 365
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

62. _____ can be used to have a single specification that automatically adapts itself to the screen width without requiring a new layout design.
a. Flexible boxes
b. Drop shadows
c. Logical tags
d. Absolute positioning
ANSWER: a
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 374
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

63. Items within a flexbox are laid out along a _____, which can point in either the horizontal or vertical direction.
a. void axis
b. main axis
c. sub axis
d. cross axis
ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 374
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

64. 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.
a. flow axis
b. logic axis
c. void axis
d. cross axis
ANSWER: d
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 374
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

65. 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;
ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 375
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

66. 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;
ANSWER: d
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 375
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

67. 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;
ANSWER: a
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 375
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

68. 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;
ANSWER: d
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 381
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.06 – Work with flex sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Flex Items
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

69. In Cascading Style Sheets (CSS) every printed page is defined as a _____.
a. boxed element
b. boxed schema
c. page schema
d. page box
ANSWER: d
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 405
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

70. A page box is composed of a _____, which contains the content of a document.
a. page element
b. page schema
c. page area
d. page layout
ANSWER: c
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 405
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

71. 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
}
ANSWER: b
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 405
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

72. 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);
}

ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 405
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

73. 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;
ANSWER: b
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 415
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.10 – Add and remove page breaks
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Page Breaks
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

74. 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;
}
ANSWER: a
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 415
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.10 – Add and remove page breaks
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Page Breaks
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

75. 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.
a. hide
b. stop
c. avoid
d. block
ANSWER: c
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 416
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.10 – Add and remove page breaks
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Page Breaks
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

76. 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;
ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 417
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.10 – Add and remove page breaks
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Page Breaks
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

77. Page breaks within block elements can often leave behind _____, which is a fragment of text left dangling at the top of page.
a. lags
b. orphans
c. widows
d. gaps
ANSWER: c
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 418
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.10 – Add and remove page breaks
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Page Breaks
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

78. Page breaks within block elements can often leave behind _____, which is a text fragment left at the bottom of a page.
a. lags
b. orphans
c. windows
d. gaps
ANSWER: b
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 418
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.10 – Add and remove page breaks
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with Page Breaks
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

 

Case-Based Critical Thinking Questions

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.

79. 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?
a. Pop-up links
b. Header links
c. Navigator menus
d. Pulldown menus
ANSWER: d
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 355
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
PREFACE NAME: Case 5-1
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Apply
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

80. 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.
a. set the width of the layout viewport to the width of the nested lists
b. put each of the nested lists within a class
c. insert the structure of the nested list within a specific style sheet structure
d. use the only keyword to hide the list items
ANSWER: b
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 356
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
PREFACE NAME: Case 5-1
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Apply
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

81. 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
b. submenuTitle:@hover+ul.submenu
c. a.submenuTitle:hover+ul.submenu
d. a.submenuTitle: ul.submenu+hover
ANSWER: c
POINTS: 1
DIFFICULTY: Challenging
REFERENCES: HTML 357
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
PREFACE NAME: Case 5-1
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Apply
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

 

Case-Based Critical Thinking Questions

Case 5-2

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.

82. 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?
a. align: value;
b. order: value;
c. justify: value;
d. content: value;
ANSWER: b
POINTS: 1
DIFFICULTY: Challenging
REFERENCES: HTML 388
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
PREFACE NAME: Case 5-2
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Reordering Page Content with Flexboxes
KEYWORDS: Bloom’s: Apply
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

83. 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?
a. align-content
b. order-content
c. justify-content
d. organize-content
ANSWER: c
POINTS: 1
DIFFICULTY: Challenging
REFERENCES: HTML 390
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
PREFACE NAME: Case 5-2
LEARNING OBJECTIVES: 05.07 – Explore flexbox layouts
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Flexbox Layouts
KEYWORDS: Bloom’s: Apply
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

84. 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.
a. space-between
b. space-around
c. space-under
d. space-above
ANSWER: a
POINTS: 1
DIFFICULTY: Challenging
REFERENCES: HTML 391
QUESTION TYPE: Multiple Choice
HAS VARIABLES: False
PREFACE NAME: Case 5-2
LEARNING OBJECTIVES: 05.07 – Explore flexbox layouts
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Flexbox Layouts
KEYWORDS: Bloom’s: Apply
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

Completion

85. _________ images, a primary component of responsive design theory, rescale based on the size of a viewing device.
ANSWER: Responsive
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 345
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Responsive Design
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

86. The _________ media type is used for fixed-width devices such as teletype machines and terminals.
ANSWER: tty
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 346
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

87. Media devices can be specified when importing one style sheet into another by adding the media type to the _________ rule.
ANSWER: @import
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 347
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

88. The _________ operator negates any feature found in an expression.
ANSWER: not
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 348
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

89. Mobile devices have a _________ viewport that displays a web page content that fits within a mobile screen.
ANSWER: visual
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 352
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.02 – Work with the browser viewport
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Viewports and Device Width
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

90. While creating a website for tablet design, objects placed with _________ positioning are removed from the document flow.
ANSWER: absolute
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 365
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.04 – Create a pulldown menu with CSS
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Tablet Design
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

91. A(n) _________ is a box containing items whose sizes can shrink or grow to match the boundaries of the box.
ANSWER: flexible box
flexbox
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 374
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

92. 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.
ANSWER: wrap-reverse
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 375
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.05 – Create a flexbox
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Flexible Boxes
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

93. 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.
ANSWER: navicon
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 394
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Navicon menu
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

94. 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.
ANSWER: media
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 403
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.08 – Create a print style sheet
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Designing for Printed Media
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

95. A page box is composed of the _________, which contains the space between the printed content and the edges of the page.
ANSWER: margin area
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 405
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

96. 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.
ANSWER: page breaks
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 406
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.08 – Create a print style sheet
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Remember
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

97. 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.
ANSWER:
break-word
POINTS: 1
DIFFICULTY: Easy
REFERENCES: HTML 412
QUESTION TYPE: Completion
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.08 – Create a print style sheet
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

Matching

Identify the letters of the choices that best match the phrases or definitions.
a. not
b. justify-content
c. Software development kit d. Mobile interface
e. Links
f. align-content
g. Media queries
h. basis size
i. Print style sheet
j. color-index
k. none
l. Handheld
DIFFICULTY: Easy
Moderate
REFERENCES: HTML 344
HTML 345
HTML 346
HTML 347
HTML 348
HTML 359
HTML 377
HTML 381
HTML 391
HTML 402
QUESTION TYPE: Matching
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.01 – Create a media query
05.03 – Apply a responsive design
05.06 – Work with flex sizes
05.07 – Explore flexbox layouts
05.08 – Create a print style sheet
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Introducing Media Queries
Introducing Responsive Design
Working with Flex Items
Exploring Flexbox Layouts
Designing for Printed Media
KEYWORDS: Bloom’s: Remember | Bloom’s: Understand
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

98. While designing websites for mobile devices, these need to be easily accessed via a touch interface.
ANSWER: e
POINTS: 1

99. This determines the properties of the device rendering a website page so that appropriate designs can be delivered to specific devices.
ANSWER: g
POINTS: 1

100. This media type is used for mobile devices with small screens and limited bandwidth.
ANSWER: l
POINTS: 1

101. The number of colors supported by an output device.
ANSWER: j
POINTS: 1

102. This operator negates any features found in an expression.
ANSWER: a
POINTS: 1

103. This property has no impact when items are flexed to fill the entire given space.
ANSWER: b
POINTS: 1

104. The best way to test this is to view it directly on a mobile device.
ANSWER: d
POINTS: 1

105. This is provided by mobile phone companies for developers to use to test their programs and websites.
ANSWER: c
POINTS: 1

106. It defines the initial size of a flex item before a browser attempts to fit it to a flexbox.
ANSWER: h
POINTS: 1

107. It is used to create an inflexible item that will not grow or shrink.
ANSWER: k
POINTS: 1

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

ANSWER: f
POINTS: 1

109. It formats the printed version of a web document.
ANSWER: i
POINTS: 1

Essay

110. Explain viewports and device width. Also, discuss setting widths in media queries.
ANSWER: 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.
Widths in media queries are based on the width of the layout viewport, not the visual viewport. In order to correctly base a media query on the physical width of the device, one has to tell the browser that the width of the layout viewport should match the device width. This can be done by adding the following meta element to the HTML file:
<meta name=”viewport” content=”properties” />
where properties is a comma-separated list of viewport properties and their values.
For example:
<meta name=”viewport”
content=”width=device-width, initial-scale=1″ />
In this meta element, the
device-width
keyword is used to set the width of the layout viewport to the physical width of the device’s screen.
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 352–353
QUESTION TYPE: Essay
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.02 – Work with the browser viewport
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Exploring Viewports and Device Width
KEYWORDS: Bloom’s: Comprehension
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

111. Describe the process of testing a mobile website.
ANSWER: 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.

POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 367
QUESTION TYPE: Essay
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.03 – Apply a responsive design
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Creating a Mobile Design
KEYWORDS: Bloom’s: Comprehension
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM

112. Briefly explain the procedure followed for setting the page size.
ANSWER:
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.
POINTS: 1
DIFFICULTY: Moderate
REFERENCES: HTML 405
QUESTION TYPE: Essay
HAS VARIABLES: False
LEARNING OBJECTIVES: 05.09 – Work with page sizes
NATIONAL STANDARDS: United States – BUSPROG: Technology
TOPICS: Working with the @page Rule
KEYWORDS: Bloom’s: Comprehension
DATE CREATED: 4/3/2017 9:41 AM
DATE MODIFIED: 4/3/2017 9:41 AM