summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/forced-colors-mode/forced-colors-mode-53-ref.html
blob: 6bfa7710fa337ffba4edf0c33d916d30aa675610 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<meta charset="utf-8">
<title>Forced colors mode - Highlight pseudos use the originating element's forced colors state</title>
<link rel="help" href="https://www.w3.org/TR/css-color-adjust-1/#forced-color-adjust-prop">
<link rel="help" href="https://drafts.csswg.org/css-highlight-api-1/">
<style>
  span.forcedColors {
    background-color: Highlight;
    color: HighlightText;
    text-decoration: underline;
    text-decoration-color: HighlightText;
    forced-color-adjust: none;
  }

  span.noForcedColors {
    background-color: yellow;
    color: blue;
    text-decoration: underline;
    text-decoration-color: orange;
    forced-color-adjust: none;
  }
</style>
<body>
  <div><span class="forcedColors">This content doesn't have forced-color-adjust set at all</span></div>
  <div><span class="noForcedColors">This content has forced-color-adjust:none on the originating element only</span></div>
  <div><span class="forcedColors">This content has forced-color-adjust:none on the ::highlight pseudo only</span></div>
  <div><span class="noForcedColors">This content has forced-color-adjust:none on the originating element and the ::highlight pseudo</span></div>
</body>