Question 1

Style rules based on the :before and :after pseudo classes use the display property to specify text or the path and name of a file.

Accepted Answer

The :before and :after pseudo-classes are used to insert content before or after an element's content, respectively, not to specify the display property or directly specify a file path. They often use the 'content' property to specify what is to be inserted.

Question 2

The animation-duration property specifies the time in seconds from the start of an animation to the end of the animation. _________________________

Accepted Answer

The animation-duration property does indeed specify the time in seconds from the start of an animation to the end of the animation.

Question 3

An animation created using animation properties and the @keyframes rule is known as a keyframe animation. _________________________

Accepted Answer

This statement is true. A keyframe animation is created using the @keyframes rule and animation properties.

Question 4

You can use the :visited pseudo-class to change the properties of input elements and other elements in forms.

Accepted Answer

The :visited pseudo-class is only applicable to links, and is used to style links that have been clicked on. It is not applicable to input elements or other form elements.

Question 5

The :before and :after pseudo-elements enable you to insert content into web pages using style rules.

Accepted Answer

The :before and :after pseudo-elements can be used to insert content before or after an element, using CSS.

Question 6

The scale keyword rotates an element a specified number of degrees. _________________________

Accepted Answer

rotate

Question 7

You can create triangles by applying CSS properties to div elements.

Accepted Answer

Yes, it is possible to create triangles by applying CSS properties such as border and transparent colors to div elements. A commonly used approach is the "CSS triangle" technique, where you create a zero-width, zero-height element and apply borders to its sides to create a triangle shape.

Question 8

CSS supports several pseudo-classes specifically for use with forms.

Accepted Answer

CSS does support several pseudo-classes specifically for use with forms such as :checked, :disabled, :enabled, :focus, :hover, and :valid.

Question 9

You use the :focus pseudo-class to specify styles for a form field when it has the focus.

Accepted Answer

This statement is true. The :focus pseudo-class is used to target form fields that have the focus, allowing you to apply specific styles to them when they are being interacted with.

Question 10

Within the braces for an @keyframes rule, you specify nested rules using pixels as selectors. _________________________

Accepted Answer

percentage

Question 11

Modern browsers support gradients as backgrounds.

Accepted Answer

Modern browsers such as Google Chrome, Mozilla Firefox and Safari support gradients as backgrounds through the use of CSS.

Question 12

Modern browsers support using the CSS transform property to apply a transform . _________________________

Accepted Answer

Modern browsers do support using the CSS transform property to apply a transform to HTML elements.

Question 13

The translate keyword repositions an element a specified amount from its default position. _________________________

Accepted Answer

This statement is true. The translate keyword in CSS repositions an element by the specified amount from its default position. It does not affect the layout or positioning of other elements on the page.

Question 14

You can use the :before pseudo-element to add an image before an element.

Accepted Answer

The :before pseudo-element can be used to add content before an element, including images.

Question 15

A filter is a visual effect in which an area starts as a single color on one edge or corner and transitions gradually to one or more other colors. _________________________

Accepted Answer

gradient

Question 16

To create a transition, the shorthand transform property or one or more of the specific properties for transitions is added to the style rule for the default state of the affected element. _________________________

Accepted Answer

transition

Question 17

In the box model, generated content is not considered part of an element's content.

Accepted Answer

The answer of In the box model, generated content is...

Question 18

Browser suffixes are words or abbreviations that are added to a property name and that are specific to one or more browsers or rendering engines. _________________________

Accepted Answer

prefixes,prefix

Question 19

Modernizr tests a browser to detect which properties are supported, a process known as browser detection. _________________________

Accepted Answer

Modernizr actually detects if a particular feature is supported, rather than relying on browser detection. It adds CSS classes to the HTML element, which can then be used in JavaScript to create fallbacks or conditionally load different assets. This approach is known as feature detection rather than browser detection.

Question 20

The :valid pseudo-class applies to form elements with user input that does not meet the rules for the field.

Accepted Answer

The :valid pseudo-class applies to form elements with user input that meets the rules for the field. The :invalid pseudo-class applies to form elements with user input that does not meet the rules for the field.

Quiz 11: Creating Visual Effects and Animation