Comment styliser les hyperliens avec CSS

En CSS, nous pouvons définir le style des hyperliens via des pseudo-classes. Par exemple, si nous voulons définir le style des hyperliens non visités, le code est comme [a:link {color: #FF0000;}. ] et définissez le style des hyperliens visités, un code tel que [a:visited {color: #00FF00;}].

L'environnement d'exploitation de cet article : système Windows 10, CSS 3, ordinateur thinkpad t480.

Si nous voulons définir le style d'un lien hypertexte, nous pouvons le faire via des pseudo-classes CSS. Ce qui suit est une introduction détaillée aux pseudo-classes CSS.

Les pseudo-classes sont utilisées pour définir des états spéciaux d'éléments.

Par exemple, il peut être utilisé pour :

• Définir le style lorsque la souris survole l'élément

• tel que visité Définir différents styles à partir des liens non visités

• Définir le style lorsque l'élément obtient le focus

Syntaxe :

selector:pseudo-class {
  property: value;
}

Exemple de code :

/* 未访问的链接 */
a:link {
  color: #FF0000;
}

/* 已访问的链接 */
a:visited {
  color: #00FF00;
}

/* 鼠标悬停链接 */
a:hover {
  color: #FF00FF;
}

/* 已选择的链接 */
a:active {
  color: #0000FF;
}

Remarque : a:hover doit être après a:link et a:visited dans la définition CSS pour prendre effet ! a:active doit être après a:hover dans la définition CSS pour prendre effet ! Les noms de pseudo-classes ne sont pas sensibles à la casse.

Partage de vidéos associées : 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!