CSS prépare des outils spécifiques pour certains effets spéciaux, que nous appelons « pseudo-classes ». Il y en a plusieurs que nous utilisons souvent. Ci-dessous, nous présenterons en détail les quatre pseudo-classes qui sont souvent utilisées pour définir les styles de liens.
Définir les styles de liens
CSS fournit des outils spécifiques pour certains effets spéciaux, que nous appelons « pseudo-classes ». Il y en a plusieurs que nous utilisons souvent. Ci-dessous, nous présenterons en détail les quatre pseudo-classes qui sont souvent utilisées pour définir les styles de liens. Ce sont :
:link
:visited
:hover :active
Puisque nous voulons définir le style du lien, la balise d'ancrage dans le lien hypertexte - a est essentielle. La méthode d'écriture de la balise d'ancrage et du lien pseudo-classe est la méthode de base pour définir le style du lien. la méthode d'écriture est la suivante :
a:link, définit le style des liens normaux ;
a:visited, définit le style des liens visités
a:hover, définit le style lorsque la souris survole ; le lien ;
a:active, définit le style lorsque la souris clique sur le lien.
Exemple :
Le code est le suivant :
a:link { color:#FF0000; text-decoration:underline; } a:visited { color:#00FF00; text-decoration:none; } a:hover { color:#000000; text-decoration:none; } a:active { color:#FFFFFF; text-decoration:none; }
Si le lien normal et le lien visité ont le même style, et que les styles de survol et de clic de la souris sont les mêmes, ils peuvent également être combinés et définis :
a:link, a:visited { color:#FF0000; text-decoration:underline; } a:hover, a:active { color:#000000; text-decoration:none; }
Il n'y a pas de règles sans règles. Bien que la définition de lien soit écrite, elle a aussi des règles. Si l'ordre d'écriture de ces quatre éléments est légèrement erroné, l'effet est obtenu. du lien peut être perdu, donc chaque fois que vous définissez les styles de lien pour la première fois, assurez-vous de confirmer l'ordre de définition, lien--visité--survol-actif, ce que nous appelons souvent le principe LoVe HAte (le majuscule les lettres sont leurs premières lettres).
Définir le style de lien local
Écrire une définition comme a:link{} en CSS changera le style de lien de la page entière, mais certains liens locaux doivent être spécialisés. Ce problème n'est pas difficile à résoudre, tant que cela est nécessaire. comme lien Ajoutez simplement l'identifiant ou la classe spécifié devant la définition de style.
Exemple :
#sidebar a:link, #sidebar a:visited { color:#FF0000; text-decoration:none; } #sidebar a:hover, #sidebar a:active { color:#000000; text-decoration:underline; }
a.redlink a:link, a.redlink a:visited { color:#FF0000; text-decoration:none; } a.redlink a:hover, a.redlink a:active { color:#000000; text-decoration:underline; background:#FFFFFF; }
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!