Maison  >  Article  >  interface Web  >  Comment définir les hyperliens pour qu'ils ne soient pas cliquables en CSS

Comment définir les hyperliens pour qu'ils ne soient pas cliquables en CSS

藏色散人
藏色散人original
2021-04-29 11:27:012546parcourir

Comment définir le lien hypertexte pour qu'il ne soit pas cliquable en utilisant CSS : utilisez d'abord l'attribut "cursor:pointer;" pour transformer la souris en flèche, puis utilisez l'attribut "pointer-events:none;" rendre le lien hypertexte invalide et non cliquable.

Comment définir les hyperliens pour qu'ils ne soient pas cliquables en CSS

L'environnement d'exploitation de cet article : système Windows 7, version HTML5&&CSS3, ordinateur DELL G3.

Utilisez les paramètres CSS pour rendre les hyperliens non cliquables ou invalides

curseur : pointer;
pointer-events: none;
La première ligne consiste à faire en sorte que la souris se transforme en flèche au lieu d'une petite forme de main
La deuxième ligne consiste à invalider le code du lien hypertexte

Non seulement une balise et une balise iframe sont également valides. L'exemple est le suivant :

<!DOCTYPE html><html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<a class="weather" href="http://www.baidu.com" >测试</a>
		<iframe class="weather" allowtransparency="true" frameborder="0" width="385" height="96" scrolling="no" src="//tianqi.2345.com/plugin/widget/index.htm?s=2&z=2&t=0&v=0&d=3&bd=0&k=&f=&ltf=009944&htf=cc0000&q=1&e=0&a=0&c=60813&w=385&h=96&align=center"></iframe>
	</body>
	<style type="text/css">
	.weather{
	    color:gray;
	    cursor:pointer;
	    pointer-events: none;
	}	</style></html>

Comment définir les hyperliens pour quils ne soient pas cliquables en CSS

Effet d'affichage original : après avoir survolé la souris, ce sera un petit. forme de la main, le style changera, et il sautera après avoir cliqué Vers l'hyperlien

Comment définir les hyperliens pour quils ne soient pas cliquables en CSS

L'effet d'affichage après le changement : le survol de la souris a la forme d'une flèche, et il n'y a pas de réponse lorsque vous cliquez sur

Pour des connaissances HTML/CSS plus détaillées, veuillez visiter la colonne 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!

Déclaration:
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