Passen Sie die Reihenfolge der zu ändernden CSS-Typen an

Sie haben vielleicht bemerkt, dass Sie CSS-Bildlaufeffekte erzeugen können, indem Sie für jeden Link unterschiedliche Stile angeben, einschließlich normaler Link (normal), Zugriff, Umdrehen und Aktivierung. Sie wissen möglicherweise auch, dass die Reihenfolge der CSS-Typen einen Unterschied in der Leistung machen kann. Nachbestellungsstile von CSS-Code ersetzen Vorbestellungsstile für dasselbe Element. Die Reihenfolge, in der die Arten von Rolleffekten erstellt werden, ist sehr wichtig.

Sehen wir uns nun an, wie man die Verbindungsstatustypen so anordnet, dass sie normale Umwälzeffekte unterstützen, ohne Konflikte zu verursachen, und wie man die Reihenfolge dieser Typen neu anordnet, um unterschiedliche Umwälzeffekte zu erzielen.

Link-Zustände

Typische CSS-Bildlaufeffekte basieren auf unabhängigen Typen für einen von vier Zuständen in einem Hyperlink. Sie können (Hyperlink-)Typen mit CSS-Vorklassen erstellen, um den Linkstatus anzugeben:

a:link – regulärer, nicht besuchter Hyperlink

a:visited – besuchter Hyperlink

a:hover – der Link, wenn der Besucher die Maus durch bewegt

a:active – auf den Link klicken

Damit der typische CSS-Scroll-Effekt ordnungsgemäß funktioniert, muss im CSS-Code The Die Reihenfolge der CSS-Typen ist sehr wichtig, unabhängig davon, ob es sich um eine externe Typtabelle oder eine in die Titelleiste einer HIML-Seite eingebettete Typregel handelt.

a: Der Linktyp erscheint am frühesten, da er auf alle Links angewendet werden kann. Der Typ a:visited kommt an zweiter Stelle und ersetzt das a:link-Format jedes Links. (Wenn auf den Typ a:link ein a:visited folgt, kann a:link den Typ a:visited ersetzen.) Gefolgt vom Typ a:hover sollte dieser Typ nur für den Zugriff auf Links unter der Maus verwendet werden. Schließlich gibt es noch a:active. Wenn also auf den Link geklickt wird, ersetzt dieser alle anderen Typen.

CODE:

Das Folgende ist ein Zitatfragment:
a:link {
color: #0000FF;
text-decoration: underline; Schriftstärke: normal;
a:visited {
text-decoration: underline; 🎜> Schriftart: kursiv;
a:hover {
Farbe: #FFFF00;
Schriftart: normal;
}
a:active {
Hintergrundfarbe: #CCCCCC;
Schriftstil: normal; > }


Die Typreihenfolge im CSS-Code wird bestimmt. Sie zeigt, wie jeder Typ andere Typen ersetzt, d. h., es können mehr Typen auf bestimmte Elemente angewendet werden. Normalerweise folgt der Typ „a:hover“ den Typen „a:link“ und „a:visited“, sodass der Typ „hover state“ auf reguläre und besuchte Links angewendet werden kann. Dies muss jedoch nicht so sein, Sie können die Reihenfolge der Typen ändern, um unterschiedliche Effekte zu erzielen.

Angenommen, Sie möchten einen Scroll-Effekt auf nicht besuchte Links anwenden, aber andere besuchte Links nicht beeinflussen. Sie denken vielleicht darüber nach, diese Darstellungsänderung durch Code zu handhaben, müssen aber nur eine Neuorganisation durchführen der CSS-Code.

Um den Scrolleffekt von besuchten Links zu entfernen, können Sie einfach den Typ a:visited entfernen.

Beachten Sie, dass der Typ „a:visited“ Regeln enthält, die dieselben Attribute wie „a:hover“ angeben. Andernfalls wird jedes „a:hover“, das nicht durch „a:“ ersetzt wird, angezeigt, wenn die Maus des Besuchers über einen Besuchslink fährt. Die Typeigenschaften des besuchten Typs werden weiterhin angezeigt.

Das Obige ist der Inhalt der Anpassung der Reihenfolge der CSS-Typen, um den Linkstatus zu ändern. Weitere verwandte Artikel finden Sie auf der chinesischen PHP-Website (www.php.cn)!