Maison >interface Web >tutoriel CSS >Que signifie le lien en CSS ?

Que signifie le lien en CSS ?

藏色散人
藏色散人original
2020-11-16 10:20:339000parcourir

Le lien en CSS fait référence à un lien CSS. Différents liens peuvent avoir des styles différents, et le style du lien peut utiliser n'importe quel attribut CSS, à savoir : 1. "a:link" ;2. "a:visité"; 3. "a:survol"; 4. "a:actif".

Que signifie le lien en CSS ?

L'environnement d'exploitation de ce tutoriel : Système Windows 10, CSS3, cet article est applicable à toutes les marques d'ordinateurs.

Liens CSS

Différents liens peuvent avoir des styles différents.

Style de lien

Le style de lien peut utiliser n'importe quelle propriété CSS (telle que la couleur, la police, l'arrière-plan, etc.).

Les liens spéciaux peuvent avoir différents styles, en fonction de leur statut.

Les quatre statuts des liens sont :

a:lien - lien normal, non visité

a:visité - lien que l'utilisateur a visité

a : survol - lorsque l'utilisateur passe la souris sur le lien

a:active - au moment où le lien est cliqué

instance

a:link {color:#000000;}      /* 未访问链接*/
a:visited {color:#00FF00;}  /* 已访问链接 */
a:hover {color:#FF00FF;}  /* 鼠标移动到链接上 */
a:active {color:#0000FF;}  /* 鼠标点击时 */

lorsqu'il est défini sur plusieurs liens Il existe également des règles d'ordre pour les styles de statut :

a:hover doit suivre a:link et a:visited

a:active doit suivre a:hover

Styles de liens communs

Sur la base des exemples ci-dessus de changements de couleur de lien, voyez dans quel état il se trouve.

Passons au style des liens avec d'autres méthodes courantes :

Décoration de texte

L'attribut text-decoration est principalement utilisé pour supprimer les soulignements dans les liens :

Instance

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:underline;}

Couleur d'arrière-plan

L'attribut background color spécifie la couleur d'arrière-plan du lien :

Instance

a:link {background-color:#B2FF99;}
a:visited {background-color:#FFFF85;}
a:hover {background-color:#FF704D;}
a:active {background-color:#FF704D;}

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