Maison > interface Web > tutoriel CSS > le corps du texte

Comment remplacer 'pointer-events: none' par la propriété CSS 'cursor' ?

DDD
Libérer: 2024-11-06 10:01:02
original
218 Les gens l'ont consulté

How to Override

Remplacement de "pointer-events: none" par la propriété CSS "cursor"

Lorsque vous essayez de désactiver un lien et d'appliquer un style de curseur personnalisé, vous pouvez rencontrer un problème où la propriété du curseur reste inchangée. Cela se produit en raison de l'utilisation de "pointer-events: none", qui désactive toutes les interactions de la souris avec l'élément.

Pour remplacer ce comportement et modifier la propriété du curseur, vous pouvez appliquer les modifications à l'élément parent de le lien. Voici un exemple :

HTML

<code class="html"><span class="wrapper">
    <a href="#">Some Link</a>
</span></code>
Copier après la connexion

CSS

<code class="css">.wrapper {
    position: relative;
    cursor: text;  /* This is used */
}
.wrapper a {
    pointer-events: none;
}</code>
Copier après la connexion

Cette technique est efficace dans la plupart des navigateurs. Cependant, il peut y avoir des incohérences dans les anciennes versions d'Internet Explorer (IE11). Pour garantir la compatibilité entre navigateurs, vous pouvez ajouter un pseudo-élément à l'élément parent :

<code class="css">.wrapper:after {
    content: '';
    position: absolute;
    width: 100%; height: 100%;
    top: 0; left: 0;
}</code>
Copier après la connexion

Avec ces modifications, vous pouvez désactiver avec succès le lien tout en conservant le style de curseur souhaité.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal