Which CSS property defines the style of the text underline?
- text-decoration-style
- text-style
- text-underline
- underline-style
The text-decoration-style property in CSS defines the style of the text underline, allowing customization of the appearance of underlined text. It can take values like solid, dashed, or double to control the underline style.
The ________ property in CSS is used to create a linear gradient as the background of an element.
- background-gradient
- background-image
- gradient-background
- linear-background
The correct answer is gradient-background. This property is used to create a linear gradient as the background of an element. It allows for smooth transitions between colors, enhancing the visual appeal of the webpage.
How do you define a CSS variable within a root element?
- #variable: value;
- $variable: value;
- --variable: value;
- var variable = value;
To define a CSS variable within a root element, you use the syntax --variable: value;. This sets up a custom property that can be later used throughout the stylesheet.
What is the significance of the 'viewport' attribute in an SVG used in a web page?
- Defines the visible area of an SVG image
- Determines the zoom level of the SVG
- Sets the width and height of the SVG element
- Specifies the position of the SVG on the web page
The 'viewport' attribute in an SVG defines the visible area of the image. It is crucial for responsive design, allowing developers to control how the SVG scales and fits within its container on different devices.
________ is a CSS property that controls the presentation of underlines, overlines, and line-throughs applied to text.
- decoration
- line
- style
- text-decoration
The correct option is text-decoration. This CSS property is used to control the presentation of text decorations, including underlines, overlines, and line-throughs. It offers various values to customize the style of text decoration.
How does CSS Houdini's Paint API enhance the capabilities of traditional CSS?
- Allows direct manipulation of the DOM to create dynamic styles.
- Enables custom rendering by providing a JavaScript API to define custom paint worklets.
- Enhances performance by pre-rendering styles during compilation.
- Introduces new color properties for enhanced color manipulation.
CSS Houdini's Paint API allows developers to define custom paint worklets in JavaScript, enabling them to create complex and dynamic visual effects that go beyond the capabilities of traditional CSS.
Icon fonts are typically included in HTML using the ________ element.
The correct option is 'd) '. Icon fonts are commonly included in HTML using the element to represent icons or symbols. The element is used for styling purposes and does not carry any semantic meaning.
In the context of web performance, what does the term "critical rendering path" refer to?
- The hierarchy of HTML elements on a page
- The order of CSS rules in a stylesheet
- The path users take to access a website
- The sequence of steps browsers take to render the content
The critical rendering path is the sequence of steps the browser takes to process and render the content of a web page. It includes tasks like parsing HTML, loading external resources, and rendering the DOM and CSSOM, all of which influence the time it takes for a page to become visible to users.
In SASS, using !________ with a variable makes it globally accessible, overriding local scope.
- global
- global-scope
- globalize
- important
The correct answer is "important." When you use !important with a SASS variable, it makes the variable globally accessible, overriding any local scopes. This is useful when you want to ensure a specific style takes precedence throughout your stylesheets, but should be used judiciously to avoid potential issues with maintainability and readability.
In a design where text needs to appear as though it is glowing, what CSS property should be used to create this effect, and how should it be manipulated to achieve the glow?
- text-shadow: 0 0 10px rgba(255, 255, 255, 0.7);
- color: #fff; text-shadow: 0 0 5px rgba(255, 255, 255, 0.7), 0 0 10px rgba(255, 255, 255, 0.7);
- font-color: #fff; text-shadow: 0 0 10px rgba(255, 255, 255, 0.7);
- text-shadow: 0 0 5px rgba(255, 255, 255, 0.7), 0 0 10px rgba(255, 255, 255, 0.7);
Option 2 is correct. It sets the text color to white and applies a text shadow with a glow effect using rgba values for transparency.