126
You can use CSS to do image rollovers by using the :hover selector for a style rule that
changes the background image for a div element
(Refer to example 16-1) The transition in the style rule for the div elements
changes the height property from 0 to 120px.
The <a> element that follows <a href="update.html">Update</a>
displays "Update" as a link
The title element in the head section of an HTML document specifies the text
that's displayed in the browser's tab for the page
For user accessibility, you should apply the same formatting to the :focus pseudo-class for an element that you apply to
the :hover pseudo-class for the element
(Refer to example 16-1) Based on the CSS for the accordion,
the accordion panels are closed when the page is loaded
As a best practice, you should only use the height and width attributes of an img element to specifiy
the actual size of the image
If you include two or more external style sheets in the head element of an HTML document,
the styles are applied from the first style sheet to the last
6. The title for an <a> element specifies
the text that's displayed when hovered
Which of the following selectors applies to all <a> elements with "hot" as their class name that are coded within a div element that has "header" as its id?
#header a.hot
Which of the following selectors is most specific?
#nav
The code that follows padding: .5em 0 .25em; applies this padding to an element:
.5em above, 0 left and right, and .25em below
Which of the following is a CSS class selector?
.first_line
Which of the following is a valid selector for a class named menu?
.menu
How many radio buttons from the following code can be selected at any given time?
3
Which of the following is NOT true about favicons?
A favicon typically has the extension .fav.
To format a web page, you use
CSS
To deploy a website, you use
FTP
To create an animated image, you use
GIF files
When the user clicks a submit button for a form,
HTML5 validation is done and the data is sent to the server if no errors are found
(Refer to example 3-1) Why does the nav element do?
It shows that its contents are used for navigation.
The most common image format for photographs in web pages is
JPEG
The WebP format was developed by Google as a replacement for
JPEG and PNG files
What will happen if the CSS that follows is applied to an h1 element?
The font size of the heading will increase to 200% over 2 seconds, change back to 120%, and then repeat.
(Refer to example 14-1) When this code is loaded in a modern browser, which of the following is NOT true?
The video will start playing automatically.
You can use the figcaption element to add a caption to
a figure element
To slowly rotate an image when the user hovers the mouse pointer over it, you can use
a transform and a transition
To help the visually impaired, you should provide a description of the image in the image element's
alt attribute
When a client requests a dynamic web page, the HTML is generated by
an application server
When a browser makes a request for a dynamic web page,
an application server processes the request and returns the HTML to the web server
By default, which type of element is displayed on a new line?
block elements
When you set the tab order for the controls of a form, the user can move from control to control
by using the Tab key
When you use a separate style sheet for printing, the link element for the print style sheet
can come before or after the link element for the screen style sheet
Which of the following is NOT one of the ways that you can specify a color in CSS?
color: getColor("red");
Which of the following can you NOT do with a filter?
convert an image to black and white
A web browser
is a program that runs on a client computer
Which of the following is NOT part of an HTTP URL:
node
If you're using Brackets to edit an HTML file, the easiest way to test it is to
select the HTML page in the text editor and click the Live Preview icon
For a two-column layout where the main content is fluid and the aside is fixed, you use CSS to
set the body width to a percent and don't set the main width
To provide a label for a control on a form, you should
set the for attribute of the label to the id of the control
You can use an image editor to do all but one of the following. Which one is it?
set the hotspots for an image
When you develop responsive web pages, you use a meta element in the HTML to
set the width of the viewport to the device width
For SEO, the title element in the head section of an HTML document
should include one or two focus keywords for ranking the page
A meta element in the head section of an HTML document
should include up to 10 keywords or phrases
The code that follows border-style: solid none; means that the box should have
solid top and bottom borders
In a 3-column layout that uses floating for page layout, you need to use CSS to
stop any floating in the footer
(Refer to example 4-1) What does the clear property do?
stops the floating of the main element to the right of the preceding block elements
In a fluid layout, you should use percents to set the widths for all but one of the following. Which one is it?
structural elements
To nest one table within another, you code the inner table within which element of the outer table?
td
The data in an HTML table is defined by the
td element
An HTML table can include all but one of these elements: table, tr, th, td, thead, tbody, tdata, tfoot Which one is it?
tdata
When you create an image map for an image element, you use
the HTML for the img element to specify the the pages that the hotspots link to
The RGBA and HSLA colors that are available with CSS3 let you specify
the opacity of the color
By default, when the user presses the Tab key, the focus moves from one control to another in
the sequence that they appear in the HTML, not including labels
HTML is used to define
the structure and contents of a web page
To provide the styles for printing a web page, you can use a @media print selector within
the style sheet for displaying the web page
When you use media queries for responsive web design,
the styles for one media query are inherited by the media queries that follow
An HTTP response is sent from
the web server to the client
When adding audio or video to a website, one problem is that
there isn't a single combination of codecs that will work in all modern browsers
In the code that follows margin: 0 auto; the auto keyword means
to center the element horizontally within the containing block
When a link element for a style sheet has a media attribute that specifies "print", that style sheet is used
to override any of the styles in the "screen" style sheet when the page is printed
The text-decoration property in a style rule is commonly used
to remove underlines from links
When you set the float property for a block element to left, the elements that follow it will flow into the space
to the right of the floated element if there's enough space
A scalable image is scaled
to the width of the element that contains it
The best way to identify a table on a page is to
treat the table as a figure and use the figcaption element
To load a web page into a web browser, you can
type the URL of the web page into the browser's address bar
To align the labels and controls on a form, you can
use CSS to float the labels to the left and set the widths of the labels and controls
Instead of using span elements to identify portions of text for formatting, you should
use HTML5 elements to identify the portions and CSS to format them
To load a web page from an intranet into your web browser, you can
use the Open or Open File command in the File menu
To provide video on a modern browser, you just need to code the
video element
The div element should only be used
when the semantic elements don't apply
Which of the following properties is used to determine the minimum number of lines that can be printed on the next page when a page break occurs within an element?
widows
(Refer to example 3-1) When the list is displayed in a browser, the list items
will be preceded by bullets
If a table doesn't fit in the browser window, the data in the columns of a table
wraps by default
When you're using the Live Preview feature of Brackets, the changes are shown in a Chrome browser as soon as
you make a change to the HTML or CSS
When you deploy a website, you upload its folders and files from
your computer or network to a web server on the Internet
If the bottom margin for one element is 1.5em and the top margin for the element below it is 1em, how large is the margin between the two elements when the page is rendered in a browser?
1.5em
(Refer to example 3-1) When this HTML code is rendered in a browser, what is the first link that will be displayed?
Jeffrey Toobin
Which of the following is NOT a guideline for user accessibility?
Make sure that each page will run in all browsers.
Which of the following is NOT a guideline for usability?
Make the pages attractive and appealing.
Which of the following do you NOT have to do to create a scalable image whose width is limited to its native size?
Set the image's height property to "auto"
Which of the following can you NOT do when adding shadows to text?
Set the opacity of the shadow.
What does the following style rule?
Sets the background color of every other row in the table, starting with the second row.
Which of the following statements is NOT true about email, url, and tel controls?
The browser will automatically validate the entries in all three of these controls.
A media type is a container that can include
a video track, one or more audio tracks, and metadata
7. The pseudo-class selectors for links let you use CSS to change the formatting for all but one of the following. Which one is it?
c. a link that is inactive
When you use Google Web Fonts or Adobe Typekit fonts, you first select a font or fonts. Then, to import the fonts into a web page, you use
either a link or a script element
Which type of selector applies to only one element?
id
You can use the CSS3 structural pseudo-classes to format a table without using
ids or classes
In HTML, you must enclose an attribute value within quotation marks
if it contains one or more spaces
The HTML5 figure element is typically used as a container for
images
To set the margins or padding for a printed web page, it makes sense to use which one of these units of measurement?
in
If you want to apply styles to all of the li elements within a main element, how do you code the selector?
main li
When you use a text editor to start a new HTML file from an old file, you
open the old file, save it with a new name, and then add code to it
Which of the following HTML5 controls is designed for data that's calculated by JavaScript or server-side code?
output
In a style sheet for printing, if you want a page break to occur before an element is printed, you can use CSS to set the
page-break-before property to always
To put a starting value in a form field when it's first displayed, you can use this field attribute:
placeholder
In the picture element that follows the source elements
provide different images for different screen sizes
Which of the following formatting can you NOT apply to boxes using CSS3?
radial gradients
By default, if you specify a background image for a block element, the image will be
repeated horizontally and vertically so it fills the element
When a browser makes a request for a static web page, the web server
returns the HTML for the page and the browser renders it
Which of the following methods would you use to transform an element so it appears wider than its original size?
scalex
For accessibility, you can indicate that a cell is associated with a column or row by using a
scope attribute
Because applications like Google and Bing rank the pages of a website, a web developer needs to be concerned with
search engine optimization
One of the benefits of using a browser's developer tools to inspect the styles that are applied to an HTML document is that you can
see how the styles from one source override the styles from another source
You use a reset selector to
set the margins and padding for all elements to zero
If you right-click on a web page and select View Source or View Page Source,
the HTML for the page will be displayed
Which of the following can you NOT specify when coding a transition?
the condition that will cause the transition to occur
When form data is sent to the server with the get method,
the data is sent as part of the url
(Refer to example 16-1) The style rule for the target pseudo-class on the div elements is applied to
the div element that has just been linked to by the user clicking on a link
When you use ems or percentages to size fonts
the font size changes as the size of the font used by its parent element changes
When you use viewport height (vh) to size fonts,
the font size changes as the size of the viewport changes
In most cases, you should use the post method instead of the get method for submitting a form because
the form data that's sent is more secure
One benefit of using Scalable Vector Graphics (SVG) instead of images is that
the images don't have to loaded from the server
To associate a field with a data list, you set
the list attribute of the field to the id of the datalist element
In the table that follows
the second cell in the first row spans four columns
To calculate the height of a box when using the box model, you add the height of the content area to the sum of the heights of the
top and bottom borders, top and bottom margins, and top and bottom padding
Which of the following methods would you use to transform an element so it appears lower than its original position?
translatey
Pseudo-class selectors let you apply formatting
when specific conditions occur
By default, the <br> tag
starts a new line of text
To gradually change one or more properties of an element, you can use
a transition
9. To create a link that goes to a placeholder on the same page, you code the href attribute as
b. # followed by the id attribute of the placeholder element
What will happen if the CSS that follows is applied to an image with an id of "image1"?
The image will rotate horizontally around its center and end up where it began.
Google publishes a web browser named
Chrome
Which of the following should you do to provide accessibility to img elements with useful content?
Code an alt attribute that describes the image.
Which of the following techniques can you NOT use to create a two-column layout?
Code the columns in any order and then float both columns to the left.
When a media player plays a video, it does all but one of the following. Which one is it?
Converts the video to the required codecs
If two CSS declarations conflict, which declarations override the other declarations?
!important declarations in a web page
Which of the following do you NOT need to do when you use the SlickNav menu plugin for a responsive web page?
Use HTML to code the menu used by SlickNav
To print a web page in a readable format, you should try to do all but one of the following. Which one is it?
Use a sans serif font for text other than headings
When will the styles for the media query that follows be applied? @media only screen and (min-width: 768px) and (max-width: 959px)
When the width of the screen is greater than 768 pixels and less than 959 pixels
When you used fixed positioning for a block element, you can
use the top, bottom, left, and right properties to set its position on the page
When you code a font-family property in a style rule,
you can specify more than one font name
To stop the browser from automatically displaying entry options when the user starts an entry in a control,
you can turn off the autocomplete attribute for the control
1. By default, an ordered list is displayed as a
a. numbered list
8. To remove the underlining from an <a> element, you can use CSS to set its
a. text-decoration property to none
10. Where does the link created by this code go to? <a href="8reasons.html#reason6">Complete, real-world applications</a>
a. the element with #reason6 as its id on the page named 8reasons.html
5. The href attribute for an <a> element specifies
a. the page that the link should go to
The CSS that follows left aligns the text in the
all header and data cells that have a class attribute set to "left"
8. (Refer to example 14-1) This code works because
all modern browsers support the MPEG-4 media type
Which of the following units is a relative unit of measurement?
an em
Which of the following units of measurement is equal to the font size for the current font?
an em
What kind of tag is this?
an empty tag
When you create an image map, you use an area element to define each hotspot along with
an href attribute that identifies the page that the hotspot links to
To implement a search function for your website, you must include
an input element, submit button, and hidden fields that specify the domain for the search and that only that domain should be searched
In HTML, a numbered list is coded with
an ol element that contains li elements
A child selector in CSS allows you to select elements that
are a direct descendant of an element
By default, the element in the box model is
as tall as it needs to be for its contents
The img element that follows gets the image file from the images folder, which is <p><img src="../images/logo.gif" alt="Murach Logo"></p>
at the same level as the current folder
The HTML5 attributes for data validation are
autocomplete, required, novalidate
21. To drop down the menu for an item in a navigation bar when the mouse pointer hovers over it, you need to use CSS like this
c. #nav_menu ul li:hover > ul { display: block; }
11. A link can be used to start or open all but one of the following. Which one is it?
c. a javascript application
19. To position a drop-down menu directly below an item in a navigation bar, you apply
c. absolute positioning to the navigation bar
16. One of the ways to create a horizontal navigation menu from an unordered list is to
c. set the display property of each li element to inline
2. A description list is a list that consists of
c. terms and descriptions
20. To create a menu that drops down from an item in a navigation bar when the mouse pointer hovers over it, you use CSS to change the display property for the menu
d. from none to block
13. When you use a link to start an email, you code the href attribute as
d. mailto: followed by the email address of the recipient
12. When you create a link that starts a video, you can code a
d. media attribute that specifies the MIME type for the media file
18. To create a drop-down menu from an item in a horizontal navigation bar, you nest
d. one ul element within each li element of the ul element for the navigation bar
17. One of the ways to create a horizontal navigation menu from an unordered list is to
d. set the display property of each li element to inline-block
After you use the CSS3 @font-face selector to embed a font in a web page, you can apply that font to selected HTML elements by using the
font-family property
To remove the space between the borders of adjacent cells, you use a CSS style rule that sets the border-collapse property
for the table to collapse
CSS is used to
format the HTML elements of a web page
After you test a page in Chrome, the easiest way to test any changes that you make to the HTML or CSS files for the page is to save the changes and then
go to Chrome and click the Reload button
Which of the following is a CSS type selector?
h1
If you want to apply styles to all <p> elements that are siblings of an h1 element, how do you code the selector?
h1~p
The code that follows
has two attributes in an opening tag
The <a> element that follows goes to a web page <a href="books/javscript.html">JavaScript and DOM Scripting</a>
in a folder that is subordinate to the current page
Before you can use the CSS3 @font-face selector, you have to store the font
in any folder of the website
When you use media queries for responsive web design, you code them
in whatever sequence you prefer because each one stands alone
In the box model for an element, the border
is between the padding and the margin
A text area is like a text field but
it can have more than one line of data
When the code that follows is loaded into the browser, <h2>About this book</h2>
it displays "About this book" in the default h2 format
In HTML, you can code a Boolean attribute as
just the attribute name
Which of the following should you NOT do when using CSS3 properties to create text columns for an article element?
justify the text
The portion of a web page that displays the most important content should be coded as an HTML5
main
The main reason for dividing a table into header, body, and footer is to
make it easier to format those components with CSS
When you use floating for a two-column, fixed width page layout, you need to
make sure the body element is wide enough for the columns
Validating an HTML file
may help you find errors that are difficult to find any other way
To adjust the appearance of a web page to different device sizes, you use
media queries
When a media player plays a video, it first determines the
media type
When you use an HTML5 video element to add video other than MP3 or MP4 to a web page, you use source elements to specify the
media type and codec for each element
In a list box, the user can select
more than one option but only if the multiple attribute is on
The CSS that follows: h1 {animation: move 3s ease-in-out 2s; } @keyframes move { from { margin-left: 20%; color: blue; } to { margin-left: 60%; color: red; } } causes a heading to be
moved to the right over 3 seconds after a delay of 2 seconds
The Internet consists
of many wide area networks that are connected to local area networks
A document-relative path in the reference for a link or image element is
relative to the folder for the current document
To provide a way to automatically send the data in a form to the server, you can add this type of button to the form:
submit
When you set the position property for a block element to absolute, the browser
takes the element out of the flow of elements on the web page
When you include JavaScript in a web application, the code is run by
the JavaScript engine of the web browser
Although the object, param, and embed elements are still supported by modern browsers,
the audio and video elements are easier to use
When you set the float property for an img element to left,
the block elements that follow it flow to the right of it
(Refer to example 4-1) Which elements will be indented?
the child <p> elements of the main element with a class named indent
When you set the border for a block element, you can set
the color, style, and width
(Refer to example 16-1) In the HTML for the accordion, each <a> element links to
the div element with the corresponding id attribute
To get the elements that come after an img element to flow to the right or left of the image, you can use CSS to apply the
the float property to the img element
If you assign an access key to a label,
the focus moves to the related control when the user presses the access key
If you use a reset selector for a page, you need to set
the margins and padding for all the elements of the page
In a style sheet for printing, the orphans property can be used to specify
the minimum number of lines in an HTML element that can be printed at the bottom of a page when a page break occurs within the element
If more than one style rule is applied to an element, which style rule is applied?
the one with the selector that has the highest specificity
The attributes of a form element specify
the submission method and the URL for the server-side script
If you want to use floating for a 3-column page layout that consists of an aside, a main element, and another aside, you need to set
the width of the body element and one or more of the contained elements to percents
When you use the float property for page layout, you should also set
the width of the floated element
14. A vertical navigation menu is best coded as
d. a series of <a> elements within the li elements of an unordered list
In the drop-down list that's defined by this code how many items can be selected at any given time?
1
Suppose the fixed width of an aside element in a fixed layout is 300 pixels, and the fixed width of its parent element (body) is 900 pixels. If you convert the page from fixed to fluid layout, the width of the aside should be set to
33.33%
The CSS3 pseudo-classes for data validation are
:required, :valid, :invalid
Which of the following is an ending tag for an h1 element
</h1>
Three inline elements are
<span>, <a>, and img
The normalize.css style sheet
Causes all browsers to render HTML elements the same way
An easy way to test a responsive design is to
Use the developer tools of a modern browser
When you use an external style sheet with an HTML document, you get all but one of the benefits that follow. Which one is it?
Your CSS coding is simpler
To change the appearance of an image after it has been loaded into the browser, you can use
a filter
A valid HTML document requires
a head element and a body element within an html element
To apply the styles in an external style sheet to an HTML document, you need to code
a link element in the head section
A codec is a software component that is used to code and decode the algorithms that are used for
a media type
Which of the following can you use in an @keyframes selector to indicate property values for specific positions in an animation?
a percent from 0 to 100
Within a CSS style rule, a declaration consists of
a property and a value
What character entity is created by the character?
a space
When you use a Markup Validation Service to validate the HTML for one web page,
a trivial coding error can cause multiple validation errors
4. To change the left alignment of the items in an unordered list, you set the
b. left padding for the ul element
15. If you want the user to be able to click anywhere in a box in a vertical navigation menu that's created by using <a> elements within the list items of an unordered list, you must
b. set the display property for the list items to block
3. You can use the CSS list-style-type property to change
b. the number style in an ordered list
When you use a regular expression to validate a form entry, the entry must
be in the pattern that's defined by the pattern attribute of the control
You can use line returns, tabs, and spaces to align your HTML code
because whitespace is ignored by browsers
If you set the background color for the body of a page to blue and you don't set the background color for a section within the body, the background of the section will be
blue
Which CSS snippet would set the border radius for a section element as shown in this screenshot?
border-radius: 10px 20px 0 20px;
In the table that follows, CSS has been used to format
borders, alignment, background colors, and border collapse
Which CSS snippet would set the border shadows for a section element as shown in this screenshot?
box-shadow: 3px 3px 4px 4px red;
Three of the common CSS selectors select
by element type, id attribute, and class attribute
The main reason for using the SlickNav plugin is to create a navigation menu that
can be accessed on a mobile device
The id attribute
can be applied to only one element in an HTML document
The class attribute
can be used by CSS to apply the same formatting to more than one HTML element
Because all browsers don't adhere to the latest HTML and CSS standards, a web developer needs to be concerned with
cross-browser compatibility
In a style sheet for printing, what property do you use to indicate that an element shouldn't be printed?
display
One way to make a table responsive is to use a media query to
display the th and td elements as block elements
The img element that follows <p><img src="../images/logo.gif" alt="Murach Logo"></p>
displays "Murach Logo" if the image can't be found
A hidden text field
doesn't appear on the form but its data is sent to the server
When you set the position property for a block element to fixed, the element
doesn't move in the browser window, even when you scroll
When you comment out a portion of HTML code, you disable it by
enclosing it within these characters: <!-- and -->
In the HTML for a three-column layout, an aside, a main element, and another aside are coded within a body element. Then, to use floating to lay out the main and aside elements in sequence from left to right on a web page, you can use CSS to
float the both asides and the main content to the left; float the first aside to the left
To lay out a web page so it adjusts to the width of the screen, you use
fluid layout