Comment désactiver le texte sélectionné en CSS

En CSS, vous pouvez utiliser l'attribut user-select pour interdire la sélection de texte. Il vous suffit d'ajouter le style "user-select:none;" à l'élément de texte. L'attribut user-select peut définir ou récupérer si l'utilisateur est autorisé à sélectionner du texte. Lorsque la valeur est « aucun », cela signifie que le texte ne peut pas être sélectionné.

L'environnement d'exploitation de ce tutoriel : système Windows 7, version CSS3&&HTML5, ordinateur Dell G3.

En CSS, vous pouvez utiliser l'attribut user-select pour désactiver la sélection de texte.

L'attribut de sélection de l'utilisateur définit ou récupère si l'utilisateur est autorisé à sélectionner du texte.

Syntaxe :

user-select：none |text| all | element

Valeur de l'attribut :

• none : Le texte ne peut pas être sélectionné

• texte : Le texte peut être sélectionné

• tout : Tout le contenu peut être sélectionné lorsque pris dans son ensemble. Si vous double-cliquez ou cliquez contextuellement sur un élément enfant, la partie sélectionnée sera l'élément ancêtre le plus élevé remontant à cet élément enfant.

• élément : le texte peut être sélectionné, mais la plage de sélection est limitée par la limite de l'élément

Code qui interdit la sélection de texte

Côté PC :

.not-select{
    -moz-user-select:none; /*火狐*/
    -webkit-user-select:none; /*webkit浏览器*/
    -ms-user-select:none; /*IE10*/
    -khtml-user-select:none; /*早期浏览器*/
    user-select:none;
}

Mobile :

.no-touch {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

Supplément : méthode js :

ontouchstart="return false;"

Ajouter ceci sur le dom qui doit être interdit Extrait de code, la prise en charge des deux méthodes pour Android et IOS n'a pas été testée séparément. Utiliser les deux en même temps peut interdire Android et IOS.

(Partage de vidéos d'apprentissage : tutoriel vidéo CSS)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!