Sélecteur de pseudo-classe du didacticiel de base CSS
Sélecteur de pseudo-classe CSS?: Ajouter des styles aux hyperliens (ajouter des styles aux différents états du lien)
Un hyperlien a quatre statuts?:
Statut normal (:link) : La souris ne se place pas sur le style de lien précédent.
état de survol (:hover)?: Le style lorsque la souris est placée sur le lien.
état actif (:active) : Maintenez enfoncé le bouton gauche de la souris sans le relacher. Cet état est particulièrement éphémère.
Statut visité (:visited)?: appuyez sur le bouton gauche de la souris et faites-le appara?tre, l'effet de style à ce moment-là.
Dans le travail quotidien, les méthodes d'écriture suivantes sont utilisées pour ajouter différents styles aux liens?:
a:link, a:visited{ color:#444; ; } //Combinez ? état normal ? et ? état visité ? en un seul.
a:hover{ color:#990000; text-decoration:underline; } //"Passez la souris" pour créer un seul effet
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
</head>
<style type="text/css">
.box {
height:30px;
border:1px solid red;
padding:10px;
}
.box a:link,.box a:visited{color:#66ff88;text-decoration:none; }/*將“正常狀態(tài)”和“訪問(wèn)過(guò)的狀態(tài)”合二為一。*/
.box a:hover{color:#ff0000;text-decoration:underline;}/*“鼠標(biāo)放上”單做一種效果*/
</style>
<body>
<div class="box">
<a href="#">歡迎來(lái)到php.cn</a>|
<a href="#">首頁(yè)</a>|
<a href="#">課程</a>|
<a href="#">問(wèn)答</a>|
<a href="#">手記</a>
</div>
</body>
</html>
