<!doctype html>
<meta charset="utf-8">
<link rel="author" name="Delan Azabani" href="mailto:[email protected]">
<link rel="stylesheet" href="support/highlights.css">
<style>
* {
text-decoration-skip-ink: none;
text-decoration-skip: none;
}
main {
font-size: 7em;
margin: 0.5em;
width: min-content;
}
.unselected {
text-decoration: #E03838C0 wavy underline;
color: #C0C000C0;
}
.selected {
background: #38E038C0;
text-decoration: #3838E0C0 wavy underline;
}
.selected, .selected * {
color: #3838E0C0;
}
.selection {
text-decoration: #663399C0 wavy line-through;
}
</style>
<!--
In this ref, three separate wavy lines are painted, with two
spanning the selected part and one spanning the unselected part.
-->
<main class="highlight_reftest">
<div class="hrt_layers">
<div>qui<span class="unselected">ck</span></div>
<div><span class="selected"><span class="selection">qui</span></span>ck</div>
quick
</div>
</main>
Codebase Browser
chromium