@starting-style
Allows you to define the initial styles for an element for its 'entry' animation. This is a game-changer because it lets you animate elements (like modals or dropdowns) as they are added to the DOM without using JavaScript timeouts.
Syntax
/* Usage Example */
div {
transition: opacity 0.5s, transform 0.5s;
opacity: 1;
transform: scale(1);
/* Styles applied the moment the element is created/displayed */
@starting-style {
opacity: 0;
transform: scale(0.9);
}
}@starting-style Browser support
Newly available
Since
2024 87% global usage
Since 2024 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
117+
129+
17.5+
117+
Your first month is free
Managed WordPress hosting for faster sites.
Learn more