<tutorialjinni.com/>

Disable Text Selection Highlighting using CSS3

Posted Under: CSS3, Programming, Snippets on Jan 29, 2017
To prevent user from copying any text from a webpage, CSS3 provide an elegant and cross browser property that eliminates the need to use JavaScript. The CSS3 property user-select is responsible to allows or disallow selection. 
.disableSelection {
                 cursor: default;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
To use it in the html simply use the above defined class 
<p>
  Selectable text.
</p>
<p class="disableSelection">
  Unselectable text.
</p>


imgae