CODEWITHSUNDEEP
csstextselection
user852974
user852974

Reputation: 2282

Changing text color when text is selected (preferably via CSS)

::selection { background: #000000; opacity: 0 }
::-moz-selection { background: #000000; opacity: 0 }

I want the select color on my website to be pure black, but my text is also pure black so when the text is selected it is hidden by the black selection. How can I change the text color to white when it is selected so that non-selected text appears as black text on the white background of the website while selected text appears as white text on a black selection? Thanks

Upvotes: 0

Views: 1316

Answers (2)

SemicolonExpected
SemicolonExpected

Reputation: 614

::selection{background: black; color:white;}
::-moz-selection{background:black; color:white;}

Just set the text color to white and make the opacity to your desired level that's >0, or in this case >80 would be better.

Upvotes: 1

Emre Erkan
Emre Erkan

Reputation: 8482

You can set color to white with CSS color property and remove opacity, because if it's transparent then you can't see it.

::selection { background: #000000; color: #ffffff; }
::-moz-selection { background: #000000; color: #ffffff; }

Example

Upvotes: 4

Related Questions