Cómo deshabilitar la selección de texto usando CSS

Por defecto, los navegadores nos permiten seleccionar el texto en el navegador usando el teclado, presionando la combinación cmd-A en una Mac, por ejemplo, o usando el mouse.

¿Cómo puede desactivar eso para que su página web se comporte más como una aplicación y menos como un documento?

Utilizar eluser-select: none;Regla CSS.

Necesita utilizar prefijos de navegador, comohttps://caniuse.com/#feat=user-select-noneCuéntanos:

-webkit-touch-callout: none;
  -webkit-user-select: none;
   -khtml-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;

Una cosa que uso a veces es hacer que toda la interfaz de la aplicación no se pueda seleccionar aplicandouser-select: none;en el elemento del cuerpo, luego puedo volver a habilitarlo en elementos específicos, usando:

user-select: text;

Más tutoriales de CSS:

• La guía de Flexbox
• Tutorial de cuadrícula CSS
• Variables CSS (propiedades personalizadas)
• Introducción a PostCSS
• La propiedad de margen CSS
• Cómo centrar un elemento con CSS
• Fuentes del sistema CSS
• Cómo imprimir tu HTML con estilo
• Una guía introductoria a las transiciones CSS
• Un tutorial de animaciones CSS
• Introducción a CSS
• La guía CSS
• Cómo configurar Tailwind con PurgeCSS y PostCSS
• La hoja de trucos de Tailwind
• Cómo rotar continuamente una imagen usando CSS
• Hacer que una tabla responda usando CSS
• Cómo depurar CSS biseccionando
• Selectores CSS
• Cascada CSS
• Especificidad CSS
• Selectores de atributos CSS
• Colores CSS
• Unidades CSS
• URL de CSS ()
• Tipografía CSS
• El modelo de caja CSS
• La propiedad de posición CSS
• Consultas de medios CSS y diseño receptivo
• Consultas de funciones CSS
• Transformaciones CSS
• Cómo diseñar listas usando CSS
• Prefijos de proveedores de CSS
• Herencia CSS
• Pseudoclases CSS
• Pseudoelementos CSS
• Diseñar tablas HTML con CSS
• La propiedad de visualización de CSS
• La función CSS calc ()
• Bordes CSS
• Importando un archivo CSS usando @import
• Manejo de errores CSS
• Filtros CSS
• Tamaño de caja CSS
• Fondos CSS
• Comentarios CSS
• Fuentes CSS
• Relleno CSS
• La propiedad flotante de CSS y su compensación
• Normalización de CSS
• La propiedad de índice z de CSS
• Cómo deshabilitar la selección de texto usando CSS
• Cómo poner un elemento en la parte inferior de su contenedor usando CSS
• Cómo invertir colores usando CSS
• Etiquetas previas receptivas en CSS
• Incrustaciones de video de YouTube receptivas
• ¿Cuáles son los buenos valores de CSS Breakpoint para Responsive Design?
• Cómo alinear el centro en flexbox