How to Disable Text Selection Highlighting in CSS

If you would like to disable the text selection highlighting that is enabled by default on all browsers, then you can do this:

user-select: none;

If you are concerned about cross-browser support, then use this class:

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

You can then use it like this:

<p>
  Selectable text.
</p>
<p class="noselect">
  Unselectable text.
</p>