How to apply a background color to only half of the text on selecting?
<p>When I select text, the background color changes to yellow.</p>

<pre><code>body p::selection {
  background: #fcf113;
  color: #000;
  display: none;
}
body p::-moz-selection {
  background: #fcf113;
}
</code></pre>

<p><a href="https://i.stack.imgur.com/ZAqrB.png" rel="noreferrer"><img src="https://i.stack.imgur.com/ZAqrB.png" alt="enter image description here"></a></p>

<p>But, I want it to appear like this.</p>

<p><a href="https://i.stack.imgur.com/h6jrh.png" rel="noreferrer"><img src="https://i.stack.imgur.com/h6jrh.png" alt="enter image description here"></a></p>

<p>Is it possible or not?</p>