Maison  >  Article  >  interface Web  >  Définir la couleur de police des hyperliens et la couleur de police après avoir cliqué sur HTML

Définir la couleur de police des hyperliens et la couleur de police après avoir cliqué sur HTML

不言
不言original
2018-06-12 11:39:522791parcourir

Cet article présente principalement la définition de la couleur de police des hyperliens et de la couleur de police après avoir cliqué en HTML. Il a une certaine valeur de référence. Maintenant, je le partage avec vous. Les amis dans le besoin peuvent s'y référer

. Les CSS pour certains effets spéciaux préparent des outils spécifiques, 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 a préparé des outils spécifiques pour certains effets spéciaux. . , nous l'appelons "pseudo-classe". 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. s'écrit comme suit :
a:link, définit le style d'un lien normal
a:visited, définit le style d'un lien visité
a:hover, définit le style au survol de la souris ; sur le lien ;
a:active, définit le style lorsque la souris clique sur le lien.
Exemple :

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; 
}
La couleur du lien définie dans l'exemple ci-dessus est rouge, le lien visité est vert, le lien est noir lorsque la souris passe dessus, et le lien est blanc lorsqu'on clique dessus .

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; 
}
L'ordre des définitions de lien

Aucune règle Bien que la définition du lien ait été écrite, elle comporte également des règles. Si l'ordre d'écriture de ces quatre éléments est légèrement erroné, l'effet du lien peut être perdu. Par conséquent, assurez-vous de confirmer l'ordre de définition à chaque fois. vous définissez un style de lien link --visited--hover-active, ce que nous appelons souvent le principe LoVe HAte (les lettres majuscules 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; 
}
Méthode d'appel :

8bd8f5f601bef3de2be1c11f4668a4f0983ac1c2e4907a5802543a50d2e35cf8Lien vers Script Home3499910bf9dac5ae3c52d5ede738348594b3e26ee717c64999d7867364b1b4a3
La méthode de définition de la classe est la même que celle de l'identifiant. Remplacez simplement #sidebar par .sidebar. Une autre méthode consiste à définir directement le style du lien. C'est plus direct , mais c'est plus difficile à appeler, car vous devez ajouter du code défini à chaque lien spécifique.
Exemple :

 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; 
}
Méthode d'appel :

e388a4556c0f65e1904146cc1a846beeabacc1b54f317844137ec285f20b3901Lien vers Script House 13499910bf9dac5ae3c52d5ede738348594b3e26ee717c64999d7867364b1b4a3
La définition du lien comporte principalement trois attributs, la couleur (color), la décoration du texte (text-decoration) et l'arrière-plan (background)

Ce qui précède est l'intégralité du contenu de cet article.J'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

CSS Introduction à l'utilisation de l'attribut Border solid

css Explication du background:transparent

Le rôle des méta dans la page html et l'analyse des paramètres de cache et de non-caching de la page

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