Desabilitar seleção de texto com user-select CSS

Neste artigo vamos Desabilitar seleção de texto com user-select CSS

Sabemos que a propriedade selecionada pelo usuário especifica se o texto de um elemento pode ser selecionado. Nos navegadores da Web, se você clicar duas vezes em algum texto, ele será selecionado/destacado.

A propriedade (user-select:none) pode ser usada para evitar isso.

O (user-select:none) no css que permite desabilitar por completo a seleção de texto, tanto via mouse quanto usando o teclado, Lembrando que se o seu usuário entender de CSS ele desabilitar essa funcionalidade no browser inspecionando o elemento ele conseguirá copiar o texto.

Vamos ver no css como podemos usar.

podemos adicionar uma classe (.no-select) e aplicar em algum lugar específico no site como: Div, section, article ou em todo o site.

.no-select {

  -webkit-user-select:none;  
  -moz-user-select:none;     
  -ms-user-select:none;      
  user-select:none;  

} 

Também podemos usar o (user-select:all;) é possível fazer com que o usuário selecione todo o texto apenas clicando em qualquer parte dele, isso é bem útil quando queremos que o usuário copie algo por completo.

Veja o exemplo abaixo:

.select-all {
  
  -webkit-user-select: all;   
  -moz-user-select: all;      
  -ms-user-select: all;       
  user-select: all;  

}