The ::view-transition-image-pair
CSS pseudo-element represents a container for a view transition's "old" and "new" view states — before and after the transition.
During a view transition, ::view-transition-image-pair
is included in the associated pseudo-element tree as explained in The view transition pseudo-element tree. It is only ever a child of a ::view-transition-group
. In terms of children, it can have a ::view-transition-new
or a ::view-transition-old
, or both.
::view-transition-image-pair
is given the following default styling in the UA stylesheet:
:root::view-transition-image-pair(*) { position: absolute; inset: 0; animation-duration: inherit; animation-fill-mode: inherit; animation-delay: inherit; }
During a view transition, ::view-transition-image-pair
has isolation: isolate
set on it in the view transition style sheet so that its children can be blended with non-normal blend modes without affecting other visual outputs.