The ________ CSS property is used to set an image as the background of an element.
- background-image
- element-background
- image-url
- set-background
The correct answer is background-image. This CSS property allows you to set an image as the background of an element, adding visual interest to the webpage. It's commonly used to enhance the design and appearance of different sections.
The ________ CSS at-rule allows defining styles for paged media, such as books or printouts.
- @document
- @media
- @page
The correct answer is "@page." The @page at-rule in CSS is used to define styles for paged media, like printouts or books. It allows you to specify various styles for different aspects of printed pages, such as margins, page size, and page breaks. This is essential for creating print-friendly stylesheets.
How do CSS preprocessors handle mathematical operations differently from regular CSS?
- They do not support mathematical operations
- They require the use of JavaScript for calculations
- They support mathematical operations directly
- They use a separate language for calculations
CSS preprocessors like SASS or LESS support mathematical operations directly, allowing developers to perform calculations within the stylesheet. This helps streamline the styling process and makes it more efficient.
The calc() function in CSS allows for dynamic calculations of property values using both fixed and relative units, such as ________.
- Em units
- Percentage units
- Pixel units
- Rem units
The calc() function in CSS allows mathematical expressions and supports various units. Pixel units are commonly used for fixed values.
How does the concept of 'partials' in SASS help in managing large stylesheets?
- Applying global styles
- Creating small, modular style files
- Importing reusable pieces of code
- Organizing comments within stylesheets
In SASS, partials allow the creation of small, modular style files that can be imported into other stylesheets, promoting code organization and reusability. This helps manage large stylesheets by breaking them into manageable pieces.
How do you apply a bold style to text in CSS?
- font-style: bold;
- text-weight: 700;
- font-weight: bold;
- bold: true;
The correct option is font-weight: bold;. This property is used to set the weight (boldness) of the font. The other options are either incorrect or do not exist in CSS.
How do CSS sprites help in improving website performance?
- By adding more images to the website
- By increasing the file size of individual images
- By reducing the number of server requests for images
- By removing all images from the website
CSS sprites combine multiple images into a single image, reducing the number of server requests. This leads to faster loading times as the browser only needs to download one image instead of multiple, especially beneficial for small icons and background images.
The CSS unit ______ is equivalent to the computed value of the font-size of the element's parent.
- rem
- em
- px
- vw
The correct option is 'rem.' The 'rem' unit represents the font-size of the root element (html), providing a scalable way to set sizes based on the base font size of the document.
How does the transform-origin property affect a transformed element in CSS?
- Defines the axis of rotation for the transformed element.
- Determines the position of the transformed element within its parent.
- Sets the scaling factor for the transformed element.
- Specifies the origin of the transformation relative to the element's border box.
The transform-origin property sets the origin for transformations, such as rotations or scaling. It defines a point around which the transformation is applied, specified in terms of percentages or length values.
To control the width of the columns in a multi-column layout, the CSS property used is column-width: ________.
- width
- column-size
- column-width
- column-length
The correct option is column-width. This property specifies the width of the columns in a multi-column layout. It can take values such as length, percentage, or the 'auto' keyword to determine the width of the columns.