diff --git a/css-pseudo-4/Overview.bs b/css-pseudo-4/Overview.bs index 26622b91425..65b5fa8e1ce 100644 --- a/css-pseudo-4/Overview.bs +++ b/css-pseudo-4/Overview.bs @@ -696,6 +696,8 @@ Styling Highlights css/css-pseudo/textpath-selection-011.html + +
  • [=custom properties=] [[!CSS-VARIABLES-1]] The 'forced-color-adjust' property cannot be set on [=highlight pseudo-elements=]; @@ -868,11 +870,12 @@ Cascading and Per-Element Highlight Styles This occurs regardless of whether that property is an inherited property (and regardless of whether that property is a [=custom property=] that is registered to [=CSS/inherit=] or not). - Additionally, - for [=highlight pseudo-elements=] originating from the root element, - the [=inherited value=] of 'color' - is ''currentColor'', - not the [=initial value=]. + + Additionally, for [=highlight pseudo-elements=] originating from the [=root element=]: + css/css-pseudo/active-selection-051.html @@ -936,6 +939,42 @@ Cascading and Per-Element Highlight Styles css/css-pseudo/cascade-highlight-002.html + The following example demonstrates the inheritance of [=custom properties=]. + +
    + For example, if an author specified +
    +     :root {
    +        --background-color: green;
    +        --decoration-thickness: 10px;
    +        --decoration-color: purple;
    +      }
    +      ::selection {
    +        --decoration-thickness: 1px;
    +        --decoration-color: green;
    +      }
    +      div::selection {
    +        --decoration-color: blue;
    +        background-color: var(--background-color, red);
    +        text-decoration-line: underline;
    +        text-decoration-style: line;
    +        text-decoration-thickness: var(--decoration-thickness, 5px);
    +        text-decoration-color: var(--decoration-color, red);
    +      }
    +    
    + A div's selection highlight would be a green background to the + selected content, with a 1px thick blue underline. The + ''--background-color'' custom property is not found on the + ''div::selection'' nor ''::selection'' so it is taken from the + ''::root'' custom property match. The ''--decoration-thickness'' + property is inherited from ''::selection'' via the highlight + cascade and ''--decoration-color'' is found in + ''div::selection'' itself. +
    + + Note: This behavior is intended to accomodate the standard practice of + defining document-wide custom properties on '':root''. +

    Painting the Highlight

    @@ -1468,6 +1507,9 @@ Changes and {{CSSPseudoElement/pseudo()}} method to address [=sub-pseudo-elements=]. (Issue 3836) +
  • Defined the behavior when custom property values are not found in the + highlight cascade; they are taken from the root. + (Issue 6641) Significant changes since the 25 February 2019 Working Draft include: