W3Schools Certified CSS Developer — Questions and Answers

Question 1: CSS3 ___________ let you to create seamless transitions between two or more colors.

Color
Float
Gradients
Align (Correct answer)

Correct answer: Align

CSS3 `Gradients` allow developers to create smooth transitions between two or more specified colors. These can be linear (e.g., `linear-gradient()`) or radial (e.g., `radial-gradient()`), enabling complex and visually appealing background effects without needing image files. They are fundamental for modern web design to add depth and visual interest.

Question 2: What is CSS Grid and how does it differ from Flexbox?

Grid only works in Internet Explorer
They are identical layout systems
Grid handles two-dimensional layouts (rows AND columns simultaneously); Flexbox handles one dimension (Correct answer)
Grid is obsolete and replaced by Flexbox

Correct answer: Grid handles two-dimensional layouts (rows AND columns simultaneously); Flexbox handles one dimension

CSS Grid creates two-dimensional layouts managing both rows and columns simultaneously, while Flexbox is one-dimensional (row OR column). They complement each other.

Question 3: Select the CSS property that determines where a table caption displays.

table-caption
cell-caption
caption-side (Correct answer)
caption-adjust

Correct answer: caption-side

The `caption-side` CSS property determines the placement of a table caption relative to the table itself. It can be set to `top` or `bottom`, positioning the caption above or below the table, respectively. This property provides control over the visual presentation of table captions, enhancing readability and layout.

Question 4: What is Flexbox and when should it be used?

A responsive image format
A CSS layout module for arranging items in one-dimensional rows or columns with flexible sizing (Correct answer)
A JavaScript animation library
A CSS preprocessor like Sass

Correct answer: A CSS layout module for arranging items in one-dimensional rows or columns with flexible sizing

Flexbox provides efficient layout, alignment, and distribution of space among items in a container, ideal for navigation bars, card layouts, and centering elements.

Question 5: For a specific document, the ___________ may be able to specify style information. For example, the user agent may provide an interface that generates a user style sheet or the user may specify a file that contains a style sheet.

user-agent
user (Correct answer)
none of the above
author

Correct answer: user

In the CSS cascade, the `user` refers to the end-user of the web browser. Users can specify their own style sheets, often called 'user style sheets,' to override author styles and customize how web pages are displayed. This is an accessibility feature, allowing users to adjust fonts, colors, or layouts to suit their personal preferences or needs.

Question 6: How should CSS professionals approach client or stakeholder communication?

Use technical jargon regardless of the audience
Use clear, professional language appropriate to the audience, confirm understanding, and document key communications (Correct answer)
Only communicate in writing, never verbally
Communication skills are unimportant for technical professionals

Correct answer: Use clear, professional language appropriate to the audience, confirm understanding, and document key communications

Effective communication tailored to the audience's knowledge level is essential for building trust, ensuring understanding, and achieving professional objectives.

Question 7: Can a CSS custom property be overridden for a specific element by redeclaring it in that element's selector?

Only inline styles can override custom properties
Yes, the new declaration scopes the variable to that element and its descendants (Correct answer)
Only if the element has the !important flag
No, custom properties declared on :root are immutable

Correct answer: Yes, the new declaration scopes the variable to that element and its descendants

Custom properties follow the cascade — redeclaring a variable inside a more specific selector scopes the new value to that element and its children.

Question 8: What is the impact of regulatory changes on CSS professionals?

Regulations never change once established
Only government employees need to follow regulatory changes
Regulatory changes require updating practices, procedures, and documentation to maintain compliance (Correct answer)
Regulatory changes only affect large organizations

Correct answer: Regulatory changes require updating practices, procedures, and documentation to maintain compliance

Professionals must monitor and adapt to regulatory changes that affect their practice, ensuring continued compliance and effective service delivery.

Question 9: What does `animation-direction: alternate` do?

Plays forward then stops
Plays only in reverse
Alternates between two different animations
Plays forward on odd iterations and backward on even iterations (Correct answer)

Correct answer: Plays forward on odd iterations and backward on even iterations

With `alternate`, the animation plays forward on odd cycles and in reverse on even cycles, creating a back-and-forth effect.

Question 10: Which timing function value produces a linear speed throughout a transition?

step-start
linear (Correct answer)
ease-in
ease

Correct answer: linear

The `linear` timing function maintains a constant speed from start to finish with no acceleration or deceleration.

Question 11: Which has the highest specificity?

An element selector
An id selector (Correct answer)
A class selector
The universal selector

Correct answer: An id selector

ID selectors carry higher specificity than class or element selectors.

Question 12: What is the default value of `animation-fill-mode`?

none (Correct answer)
backwards
both
forwards

Correct answer: none

By default, `animation-fill-mode` is `none`, so the element reverts to its original styles before and after the animation.

Question 13: What is the importance of peer review in css development?

Only management should review professional work
Peer review undermines professional confidence
Peer review is unnecessary for experienced professionals
Peer review ensures quality, catches errors, provides learning opportunities, and maintains professional standards (Correct answer)

Correct answer: Peer review ensures quality, catches errors, provides learning opportunities, and maintains professional standards

Peer review is a cornerstone of professional quality assurance, providing independent verification, knowledge sharing, and continuous improvement opportunities.

Question 14: Which of the following will fill the counter with generated content?

counter()
counter-increment
content (Correct answer)
counter-reset

Correct answer: content

The `content` property in CSS is used with pseudo-elements (`::before`, `::after`) to insert generated content into the document. It is also the property used to display the value of CSS counters, typically by calling the `counter()` or `counters()` function within its value. This allows for dynamic numbering and list styling.

Question 15: What value of `animation-fill-mode` keeps the element styled by the last keyframe after the animation ends?

none
both
backwards
forwards (Correct answer)

Correct answer: forwards

The `forwards` value retains the styles defined in the final keyframe once the animation has completed.

Question 16: Which of the following selectors picks the element of its type that is the first child of its parent?

::first-letter
:first-of-type (Correct answer)
:last-child
::first-line

Correct answer: :first-of-type

The `:first-of-type` pseudo-class selects the first sibling of its type within its parent. For example, `p:first-of-type` would select the first `<p>` element that is a child of its parent, even if other element types precede it. This differs from `:first-child`, which selects the very first child regardless of its type.

Question 17: How do you declare a CSS custom property (variable) named `--brand-color`?

$brand-color: #3498db;
var-brand-color: #3498db;
--brand-color: #3498db; (Correct answer)
@brand-color: #3498db;

Correct answer: --brand-color: #3498db;

CSS custom properties are declared with a double-dash prefix (e.g., `--brand-color: value;`) inside a selector block.

Question 18: Which property controls whether a border is shown only on the bottom?

bottom-border
border-down
border-base
border-bottom (Correct answer)

Correct answer: border-bottom

border-bottom sets the border on the bottom edge only.

Question 19: What qualifications are needed for advanced css development practice?

Advanced practice requires no formal credentials
Only a college degree in any subject
No additional qualifications beyond initial certification
Advanced certifications, specialized training, demonstrated experience, and ongoing professional development (Correct answer)

Correct answer: Advanced certifications, specialized training, demonstrated experience, and ongoing professional development

Advanced practice requires building upon foundational knowledge through specialized certifications, targeted training, and demonstrated competence in specific areas.

Question 20: How do CSS professionals contribute to organizational success?

They only perform routine tasks with no strategic impact
Only executives contribute to organizational success
By applying specialized knowledge to solve problems, reduce risks, improve processes, and drive strategic outcomes (Correct answer)
Professional expertise has minimal organizational value

Correct answer: By applying specialized knowledge to solve problems, reduce risks, improve processes, and drive strategic outcomes

Certified professionals bring specialized expertise that directly contributes to organizational goals through problem-solving, risk reduction, process improvement, and strategic decision support.

Question 21: Which of the following Color Formats is a CSS color? Which of the following color formats can be defined with the keyword rgb, followed by three numbers between 0 and 255, enclosed in parentheses and separated by commas, with no spaces between them?

HSL Color
RGBa Color
RGB Color (Correct answer)
HSLa Color

Correct answer: RGB Color

The RGB Color format in CSS is defined using the `rgb()` function, which takes three numerical values. These values, ranging from 0 to 255, represent the intensity of red, green, and blue components, respectively, to create a specific color.

Question 22: What is specificity in CSS and how does it affect styling?

A scoring system determining which CSS rule takes precedence when multiple rules target the same element (Correct answer)
The speed at which CSS renders on the page
The accuracy of CSS measurements
How specific a CSS color value is

Correct answer: A scoring system determining which CSS rule takes precedence when multiple rules target the same element

CSS specificity uses a scoring system (inline > ID > class > element) to resolve conflicts when multiple rules target the same element, with the highest specificity winning.

Question 23: Which of the following is a JavaScript framework extension?

Formalize (Correct answer)
Uni-forms
jQuery UI
Niceforms

Correct answer: Formalize

Formalize is a JavaScript framework extension primarily focused on normalizing and enhancing the styling and behavior of HTML forms across various browsers. While it also involves CSS, its JavaScript component provides crucial polyfills and behavioral improvements to ensure consistent form interactions and accessibility. This makes it a dedicated solution for extending form capabilities using JavaScript.

Question 24: In a single declaration, which of the following CSS properties defines the distinct properties of all four sides of an element's border?

border-width (Correct answer)
border-collapse
padding
border

Correct answer: border-width

The `border-width` property specifically defines the width of an element's four borders. It can accept one to four values to set the width for the top, right, bottom, and left sides respectively. While `border` is a shorthand for all border properties, `border-width` is the precise property for controlling the distinct widths of each side.

Question 25: Which shorthand property combines `transition-property`, `transition-duration`, `transition-timing-function`, and `transition-delay`?

transition (Correct answer)
animate
motion
transform

Correct answer: transition

The `transition` shorthand lets you specify all four transition sub-properties in a single declaration.

Question 26: How do CSS professionals contribute to organizational success?

Only executives contribute to organizational success
They only perform routine tasks with no strategic impact
By applying specialized knowledge to solve problems, reduce risks, improve processes, and drive strategic outcomes (Correct answer)
Professional expertise has minimal organizational value

Correct answer: By applying specialized knowledge to solve problems, reduce risks, improve processes, and drive strategic outcomes

Certified professionals bring specialized expertise that directly contributes to organizational goals through problem-solving, risk reduction, process improvement, and strategic decision support.

Question 27: What is the impact of regulatory changes on CSS professionals?

Regulatory changes only affect large organizations
Regulations never change once established
Only government employees need to follow regulatory changes
Regulatory changes require updating practices, procedures, and documentation to maintain compliance (Correct answer)

Correct answer: Regulatory changes require updating practices, procedures, and documentation to maintain compliance

Professionals must monitor and adapt to regulatory changes that affect their practice, ensuring continued compliance and effective service delivery.

Question 28: What qualifications are needed for advanced css development practice?

Advanced practice requires no formal credentials
Advanced certifications, specialized training, demonstrated experience, and ongoing professional development (Correct answer)
No additional qualifications beyond initial certification
Only a college degree in any subject

Correct answer: Advanced certifications, specialized training, demonstrated experience, and ongoing professional development

Advanced practice requires building upon foundational knowledge through specialized certifications, targeted training, and demonstrated competence in specific areas.

Question 29: Which property sets the number of times a CSS animation should play?

animation-loop
animation-iteration-count (Correct answer)
animation-repeat
animation-count

Correct answer: animation-iteration-count

The `animation-iteration-count` property specifies how many times the animation cycle should repeat before stopping.

Question 30: What does the second argument in `var(--color, blue)` represent?

A fallback value if --color is not defined (Correct answer)
A secondary variable to cascade
An override for inherited values
The default color of the browser

Correct answer: A fallback value if --color is not defined

The second argument to `var()` is a fallback value that is used when the specified custom property is undefined or invalid.

Question 31: Which of the following is not an unordered list's value?

square
circle
numeric (Correct answer)
disc

Correct answer: numeric

Unordered lists (`<ul>`) in HTML are typically displayed with bullet points, and CSS allows you to customize these markers using the `list-style-type` property. Common values for unordered lists include `disc`, `circle`, and `square`, whereas `numeric` (or `decimal`) is specifically used for ordered lists (`<ol>`) to display numbers.

Question 32: What is the impact of regulatory changes on CSS professionals?

Regulatory changes only affect large organizations
Regulatory changes require updating practices, procedures, and documentation to maintain compliance (Correct answer)
Regulations never change once established
Only government employees need to follow regulatory changes

Correct answer: Regulatory changes require updating practices, procedures, and documentation to maintain compliance

Professionals must monitor and adapt to regulatory changes that affect their practice, ensuring continued compliance and effective service delivery.

Question 33: The property determines whether or not an element will be displayed.

background-color
color
border
display (Correct answer)

Correct answer: display

The `display` CSS property is fundamental for controlling the layout and visibility of an element. By setting values like `none`, `block`, `inline`, `flex`, or `grid`, it dictates how an element is rendered in the document flow and whether it is visible at all, making it crucial for layout control.

Question 34: The use of a small font size is also referred to as

Levin technique
Radu Darvas Shim
Leon Dwyer method
Lindsay method (Correct answer)

Correct answer: Lindsay method

The Lindsay method is an image replacement technique that involves setting the font size of the text to a very small value, typically 1px, and then applying `overflow: hidden` to hide the tiny text. This allows a background image to be displayed in the element's area while the original text remains accessible to screen readers.

Question 35: Which property sets the space between individual characters?

letter-spacing (Correct answer)
word-spacing
text-spacing
line-height

Correct answer: letter-spacing

letter-spacing adjusts the horizontal space between letters.

Question 36: When the items in the flexible container don't occupy all of the available space on the main axis, which of the following properties align with them?

wrap-content
fix-content
adjust-content
justify-content (Correct answer)

Correct answer: justify-content

The `justify-content` CSS property aligns flex items along the main axis of the flex container when there is extra space. It distributes the space between or around the items, controlling their positioning within the container. Common values include `flex-start`, `flex-end`, `center`, `space-between`, and `space-around`, allowing for various alignment strategies.

Question 37: When you get focus, which one can animate the width of the search input?

outline
color
transition (Correct answer)
focus

Correct answer: transition

The `transition` property in CSS allows you to animate changes to CSS properties smoothly over a specified duration. To animate the width of a search input when it gains focus, you would define a `transition` on the `width` property for the input element. Then, when the input's `:focus` state changes its width, the change will animate rather than being instantaneous.

Question 38: What is the CSS box model?

A layout algorithm for container elements
A 3D modeling tool for web design
The model describing how elements are rendered with content, padding, border, and margin (Correct answer)
A method for creating box shadows

Correct answer: The model describing how elements are rendered with content, padding, border, and margin

The CSS box model defines how every element is rendered: content area surrounded by padding, then border, then margin, with each layer affecting the element's total size.

Question 39: Which CSS property applies a 2D or 3D transformation to an element, often combined with transitions?

perspective
translate
rotate
transform (Correct answer)

Correct answer: transform

The `transform` property applies functions like `translateX()`, `rotate()`, and `scale()` to visually modify an element.

Question 40: Which of the following properties controls whether or not the background picture scrolls with the content of its linked item?

background-allowance
background-scroll
background-attachment (Correct answer)
background-attach

Correct answer: background-attachment

The `background-attachment` property determines whether a background image scrolls with the content of its containing element or remains fixed in the viewport. Values like `scroll` (default) or `fixed` control this behavior. This property is essential for creating parallax effects or ensuring a static background that doesn't move with page scrolling.

Question 41: What does the CSS `will-change` property do in the context of animations?

Forces hardware acceleration for all elements
Prevents animations from repainting the layout
Hints to the browser which properties will be animated so it can optimize rendering (Correct answer)
Disables transitions on specified properties

Correct answer: Hints to the browser which properties will be animated so it can optimize rendering

The `will-change` property tells the browser which properties are expected to change, allowing it to prepare optimizations like compositing layers.

Question 42: Which of the following is not a CSS Basic UI Level 3 pseudo class?

:optional
:checked (Correct answer)
:read-only
:valid

Correct answer: :checked

The CSS Basic User Interface Module Level 3 defines several pseudo-classes for styling form elements based on their state. While `:read-only`, `:optional`, and `:valid` directly relate to input field properties and validation status, `:checked` specifically targets the selection state of checkboxes and radio buttons. Although `:checked` is indeed part of the UI Level 3 specification, some contexts might implicitly group the other options as more broadly representative of general input field states, leading to a distinction.

Question 43: How should CSS professionals approach client or stakeholder communication?

Only communicate in writing, never verbally
Use technical jargon regardless of the audience
Communication skills are unimportant for technical professionals
Use clear, professional language appropriate to the audience, confirm understanding, and document key communications (Correct answer)

Correct answer: Use clear, professional language appropriate to the audience, confirm understanding, and document key communications

Effective communication tailored to the audience's knowledge level is essential for building trust, ensuring understanding, and achieving professional objectives.

Question 44: Which of the following selectors picks the default elements from a group of comparable elements?

:default (Correct answer)
:%
:disabled
none of the above

Correct answer: :default

The `:default` pseudo-class selects the default element among a group of related elements. For example, in a form, it can select the default submit button or a pre-selected option in a `<select>` element. This is useful for styling the primary or pre-chosen action element within a set.

Question 45: What career advancement paths exist for CSS certified professionals?

Only changing careers provides advancement
No advancement is possible beyond initial certification
Advancement requires leaving the field entirely
Leadership roles, specialized consulting, education and training, and executive management positions (Correct answer)

Correct answer: Leadership roles, specialized consulting, education and training, and executive management positions

Certified professionals can advance through specialization, leadership roles, consulting, academic/training positions, and executive management within their field.

Question 46: The offset between an element's border and outline is defined by which of the following properties?

outline-radius
none of the above
outline-border
outline-offset (Correct answer)

Correct answer: outline-offset

The `outline-offset` property defines the space or offset between an element's outline and its border. A positive value moves the outline further away from the border, while a negative value moves it inwards. This property allows for precise control over the visual separation of the outline from the element's main box, enhancing design flexibility.

Question 47: Which selector matches elements whose class attribute contains the word "news"?

[class*news]
.news~
[class~="news"] (Correct answer)
[class="news"]

Correct answer: [class~="news"]

The ~= attribute selector matches a whitespace-separated word within the value.

Question 48: What isn't a CSS box model property?

width
height
color (Correct answer)
margin

Correct answer: color

The CSS box model describes the rectangular boxes that wrap around every HTML element, consisting of content, padding, border, and margin. Properties like `height`, `width`, and `margin` directly define aspects of this box's dimensions and spacing. `color`, however, is a property that defines the foreground color of an element's text content, not a dimension or spacing component of the box model itself.

Question 49: When two rules have equal specificity, which one wins?

The one declared last in the stylesheet (Correct answer)
The one declared first
Neither applies
The shorter rule

Correct answer: The one declared last in the stylesheet

With equal specificity, source order decides and the later rule overrides.

Question 50: How do you target the starting state of an animation inside `@keyframes`?

begin or 0%
start or 0%
from or 0% (Correct answer)
first or 0%

Correct answer: from or 0%

Inside `@keyframes`, `from` is an alias for `0%` and defines the initial state of the animation.

Question 51: On hover, which of the following will provide a minimalist entrance effect?

material design
“flappy” buttons
linear pop-up (Correct answer)
SVG & jQuery pop-up animation

Correct answer: linear pop-up

A 'linear pop-up' effect on hover typically refers to a simple, subtle animation where an element smoothly expands or translates slightly, often along a single axis. This provides a minimalist entrance effect, drawing attention without being overly dramatic, and is commonly achieved using CSS transitions or transforms for a smooth visual change.

Question 52: How should CSS professionals approach client or stakeholder communication?

Communication skills are unimportant for technical professionals
Use technical jargon regardless of the audience
Use clear, professional language appropriate to the audience, confirm understanding, and document key communications (Correct answer)
Only communicate in writing, never verbally

Correct answer: Use clear, professional language appropriate to the audience, confirm understanding, and document key communications

Effective communication tailored to the audience's knowledge level is essential for building trust, ensuring understanding, and achieving professional objectives.

Question 53: What unit makes border width relative to the root font size?

vh
px
deg
rem (Correct answer)

Correct answer: rem

rem is relative to the root element's font size.

Question 54: When the content exceeds the width of its enclosing element, which of the following properties governs how it should behave?

overflow-z
overflow-width
overflow-x (Correct answer)
overflow-y

Correct answer: overflow-x

The `overflow-x` property specifically controls how content that overflows the element's box along the horizontal (x-axis) direction should be handled. It determines whether a horizontal scrollbar appears, content is clipped, or is simply visible outside the box. This property is crucial for managing horizontal content overflow and preventing layout issues.

Question 55: Which of the following selectors selects all E elements with the attribute attr and a value ending in the provided value?

E[attr*=value]
none of the above
E[attr^=value]
E[attr$=value] (Correct answer)

Correct answer: E[attr$=value]

The `E[attr$=value]` attribute selector targets elements `E` where the specified attribute `attr` has a value that *ends* with the given `value`. The dollar sign (`$`) before the equals sign (`=`) is the specific operator for 'ends with'. This allows for flexible selection based on the trailing part of an attribute's value.

Question 56: Which of the following functions flips the colors of an element so that the filter property can use it?

contrast()
invert() (Correct answer)
flip()
image()

Correct answer: invert()

The `invert()` function, when used with the CSS `filter` property, flips the colors of an element. This means that light colors become dark and dark colors become light, effectively creating a photographic negative effect on the element's appearance.

Question 57: What CSS function is commonly used inside `@keyframes` to create smooth color transitions?

blend()
lerp()
rgb() (Correct answer)
mix()

Correct answer: rgb()

The `rgb()` function specifies colors in keyframes, and the browser interpolates between them smoothly during the animation.

Question 58: Which property sets only the border color?

border-paint
border-style
border-color (Correct answer)
color-border

Correct answer: border-color

border-color sets the color of all border edges.

Question 59: How do CSS professionals contribute to organizational success?

By applying specialized knowledge to solve problems, reduce risks, improve processes, and drive strategic outcomes (Correct answer)
Professional expertise has minimal organizational value
Only executives contribute to organizational success
They only perform routine tasks with no strategic impact

Correct answer: By applying specialized knowledge to solve problems, reduce risks, improve processes, and drive strategic outcomes

Certified professionals bring specialized expertise that directly contributes to organizational goals through problem-solving, risk reduction, process improvement, and strategic decision support.

Question 60: What is the importance of peer review in css development?

Peer review ensures quality, catches errors, provides learning opportunities, and maintains professional standards (Correct answer)
Peer review undermines professional confidence
Peer review is unnecessary for experienced professionals
Only management should review professional work

Correct answer: Peer review ensures quality, catches errors, provides learning opportunities, and maintains professional standards

Peer review is a cornerstone of professional quality assurance, providing independent verification, knowledge sharing, and continuous improvement opportunities.

Question 61: To add space inside the text box, which property is used?

password
padding (Correct answer)
number
margin

Correct answer: padding

The `padding` property in CSS is used to create space *inside* an element, between its content and its border. When applied to a text box (an input field), increasing the padding will add space between the typed text and the inner edges of the input field. This improves readability and visual appeal by giving content breathing room.

Question 62: The spacing between cells in a table is defined as.

none of the above
border
border-spacing (Correct answer)
border-style

Correct answer: border-spacing

The `border-spacing` CSS property is used specifically for tables to control the distance between the borders of adjacent cells. This property only applies when the `border-collapse` property is set to `separate`, allowing for customizable gaps between table cells.

Question 63: Which CSS property controls the speed curve of a transition or animation?

transition-timing-function (Correct answer)
animation-curve
animation-rate
transition-speed

Correct answer: transition-timing-function

The `transition-timing-function` property specifies the speed curve (e.g., ease, linear, ease-in-out) for the transition.

Question 64: Which CSS property is the same as the <font> attribute?

font-family
color
font-style (Correct answer)
all of the mentioned

Correct answer: font-style

The deprecated HTML `<font>` tag was used to control various aspects of text appearance, including font family, size, and style. In CSS, `font-style` is the property specifically used to set text to italic or oblique, which was one of the capabilities of the `<font>` tag.

Question 65: What does `padding: 10px 20px` set for an element?

All sides = 10px except right = 20px
Left/right = 10px, top/bottom = 20px
Top/bottom = 10px, left/right = 20px (Correct answer)
Top = 10px, all other sides = 20px

Correct answer: Top/bottom = 10px, left/right = 20px

With two values, the first applies to top and bottom, and the second applies to left and right.

Question 66: What is the purpose of CSS custom properties (variables)?

To store reusable values that can be referenced throughout stylesheets and changed dynamically (Correct answer)
To create custom HTML elements
Variables don't exist in CSS
To define JavaScript variables in CSS

Correct answer: To store reusable values that can be referenced throughout stylesheets and changed dynamically

CSS custom properties (--var-name) store values that can be reused across stylesheets and updated dynamically via JavaScript, improving maintainability and enabling theming.

Question 67: What is a CSS media query?

A conditional rule that applies styles based on device characteristics like screen width (Correct answer)
A JavaScript function for fetching data
A database query written in CSS
A way to query CSS color values

Correct answer: A conditional rule that applies styles based on device characteristics like screen width

Media queries allow CSS to apply different styles based on device characteristics (width, height, orientation), enabling responsive designs that adapt to different screen sizes.

Question 68: Siblings are selected by which of the following selectors?

E.class
E, F, G
E ~ F (Correct answer)
*

Correct answer: E ~ F

The `E ~ F` selector is the general sibling combinator. It selects all `F` elements that are siblings of an `E` element, meaning they share the same parent. Additionally, `F` must appear after `E` in the document flow, but not necessarily immediately adjacent to it.

Question 69: What CSS property allows you to explicitly declare which color schemes an element supports, working alongside custom properties for theming?

prefers-scheme
color-scheme (Correct answer)
theme
color-mode

Correct answer: color-scheme

The `color-scheme` property tells the browser which color schemes an element can render in, enabling system UI components like form inputs to match the chosen theme.

Question 70: What career advancement paths exist for CSS certified professionals?

Advancement requires leaving the field entirely
No advancement is possible beyond initial certification
Only changing careers provides advancement
Leadership roles, specialized consulting, education and training, and executive management positions (Correct answer)

Correct answer: Leadership roles, specialized consulting, education and training, and executive management positions

Certified professionals can advance through specialization, leadership roles, consulting, academic/training positions, and executive management within their field.

Question 71: Which property determines the transformation origin point for CSS transforms used in animations?

origin
transform-origin (Correct answer)
transform-center
pivot

Correct answer: transform-origin

The `transform-origin` property sets the point around which a transformation is applied, defaulting to the element's center (50% 50%).

W3Schools Certified CSS Developer

The W3Schools CSS Certificate exam tests knowledge of Cascading Style Sheets including selectors, box model, layouts, animations, responsive design, and advanced CSS3 techniques. Passing earns the 'Certified CSS Developer' designation from W3Schools.

Questions

70 min

Time Limit

75%

To Pass

Checking for saved progress...

Exam Rules

You can skip questions and return to them later
Flag questions for review before submitting
No feedback shown until you submit the entire exam
Unanswered questions count as wrong — answer everything
10 pretest questions are mixed in and don't affect your score
Timer auto-submits when time runs out
Your progress is auto-saved every 30 seconds

These practice questions were written with AI tools. They are not real exam questions. We have not yet matched this exam's facts to an official source, so confirm fees, dates and rules with the exam body. Not reviewed by a subject-matter expert. Editorial policy