Disable text selection highlighting using CSS rule

Disable text selection

There is a CSS standard way by which you can disable the highlighting effect i.e. disable text selection when you select any text.

This can be done using JavaScript but using CSS you can achieve this also.

<style type="text/css">
.disableselect {
user-select: none;
-ms-user-select: none;
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
}
</style>
<p>You can select this text</p>
<p class="disableselect">But, you can not select this text</p>

RESULT:

You can select this text

But, you can not select this text

For IE, you can use JavaScript solutions for doing this as some of the browser may not resolve this strategy.

<p onselectstart="return false;">You can not select this text</p>

Leave a Reply

Your email address will not be published. Required fields are marked *