The process by which styles are applied to an element based on their source and specificity is known as the ________.

  • Cascade
  • Declaration
  • Inheritance
  • Specificity
The process by which styles are applied to an element based on their source and specificity is known as the Cascade. Cascade refers to the process of determining which styles should be applied when there are conflicting style rules from different sources like user styles, author styles, and browser defaults.

The ________ filter in CSS is used to adjust the brightness of an element.

  • blur
  • brightness
  • contrast
  • sepia
The brightness filter in CSS is used to adjust the brightness of an element. It allows you to control how bright or dark an element appears, with values less than 1 making it darker, and values greater than 1 making it brighter.

Which property-value combination will make text both italicized and bold?

  • font-bold: true; font-italic: true;
  • font-type: bold-italic;
  • font-weight: bold; font-style: italic;
  • text-decoration: underline; font-style: italic;
To make text both italicized and bold, you should use the CSS properties font-weight: bold; to make it bold and font-style: italic; to make it italic. This combination creates text that is both thicker and slanted, resulting in bold and italicized text.

You're trying to vertically center a single item inside a container using Flexbox. Which properties would you set on the container to achieve this?

  • align-items: center and flex-direction: center
  • align-items: center and justify-content: center
  • flex-direction: center and flex-wrap: center
  • justify-content: center and align-content: center
To vertically center a single item inside a container using Flexbox, you would set the align-items property to "center" to vertically align the item within the container, and you would set justify-content to "center" to horizontally center the item within the container.

You're creating a button hover effect where the button scales up gradually. Which combination of CSS properties would you primarily use?

  • transform: scale(1.2);
    transition: transform 0.3s ease-in-out;
  • transition: scale(1.2) 0.3s ease-in-out;
    transform: scale(1.2);
  • scale(1.2);
    transition: transform 0.3s ease-in-out;
  • transform: scale(1.2);
    animation: scaleUp 0.3s ease-in-out;
To create a button hover effect where the button scales up gradually, you would primarily use the combination of CSS properties: transform: scale(1.2); for scaling the button and transition: transform 0.3s ease-in-out; to specify the transition duration, easing function, and the property to be transitioned (in this case, "transform"). This combination smoothly scales up the button on hover.

If you want an animation to play forwards first, then reverse on alternate cycles, which value of animation-direction would you use?

  • alternate
  • alternate-reverse
  • normal
  • reverse
To make an animation play forwards first and then reverse on alternate cycles, you would use the animation-direction property with the value alternate-reverse. This value causes the animation to run normally on odd iterations (forwards) and in reverse on even iterations.

The ::first-letter pseudo-element in CSS targets the ________ of a block-level element.

  • First character
  • First letter
  • First line
  • First word
The ::first-letter pseudo-element in CSS is used to target the first letter of a block-level element, such as a paragraph or a heading. It's commonly used for styling the initial letter of a text block, for decorative or typographic purposes.

Which of the following is NOT a unit for font-size in CSS?

  • cm
  • em
  • ex
  • px
In CSS, font-size can be specified in various units, including em, ex, px, and cm. However, 'cm' is not a common unit for font-size. It's typically used for specifying dimensions of other elements, like margins or padding.

Which extension is used for SCSS files?

  • .css
  • .scss
  • .html
  • .js
SCSS (Sassy CSS) files have the ".scss" extension. This extension is used to indicate that the file contains SCSS syntax, which is a more CSS-like syntax with additional features provided by SASS.

The pseudo-class :nth-of-type(2) in CSS targets the ________ of its type.

  • any element
  • first element
  • last element
  • second element
The pseudo-class :nth-of-type(2) in CSS targets the second element of its type. It allows you to select and style the second occurrence of an element type within its parent container. This is useful for creating specific styles for the second element, such as the second paragraph or the second list item.