Lernen Sie Hyperlink A Markup_HTML/Xhtml_Web Page Production

F:
Ich habe CSS verwendet, um den Stil des Hyperlinks zu definieren, aber der Mauszeiger (Mouseover) funktioniert beim Surfen nicht. Warum passiert das? Handelt es sich um ein Browserproblem?
Antwort:
Obwohl Sie glauben, dass die mögliche Ursache ein Browserproblem ist, ist es wahrscheinlicher, dass die Reihenfolge Ihrer Stildefinitionen falsch ist. Um sicherzustellen, dass Sie die Verbindungsstile in verschiedenen Zuständen sehen können, sollte die richtige Reihenfolge der Stile lauten:
„Link – besucht – Hover – aktiv“ oder „LVHA“ (Abkürzung).
Kerninhalt:
Jeder Selektor hat eine „Spezifität“. Wenn zwei Selektoren auf dasselbe Element angewendet werden, gewinnt der Selektor mit der höheren Spezifität und hat Priorität. Zum Beispiel:
P.hithere {color: green;} /* specifity = 1,1 */
P {color: red;} /* specifity = 1 */
Any set class class=hithere Der Absatzinhalt wird in Grün statt in Rot angezeigt. Beide Selektoren legen die Farbe fest, aber der Selektor mit der höheren Spezifität gewinnt.
Wie wirken sich Pseudoklassen auf die Spezifität aus? Sie haben genau den gleichen Gewichtungswert und die folgenden Stile haben den gleichen Spezifitätsgewichtungswert:
A:link {color: blue;} /* specifity = 1,1 */
A:active {color: red ;} /* Spezifität = 1,1 */
A:hover {Farbe: Magenta;} /* Spezifität = 1,1 */
A:visited {Farbe: Lila;} /* Spezifität = 1, 1 * /
Dies sind Stileinstellungen für Hyperlinks. In den meisten Fällen ist es notwendig, mehrere Stile gleichzeitig festzulegen. Beispielsweise kann ein nicht besuchter Hyperlink beim Bewegen der Maus und beim Klicken unterschiedliche Stile in den beiden Zuständen „Mausbewegen“ und „Mausaktivierung“ festlegen. Die oben genannten drei Regeln können alle auf Hyperlinks angewendet werden, und alle Selektoren haben die gleiche Spezifität, dann „gewinnt“ gemäß den Regeln der letzte Stil. Daher wird der „aktive“ Stil nie angezeigt, da er immer vom „Hover“-Stil überschrieben wird (d. h. „Hover“ hat Vorrang). Lassen Sie uns nun die Auswirkung des Mouseovers auf einen besuchten Hyperlink analysieren. Das Ergebnis ist immer lila :(, da sein „besuchter“ Stil immer Vorrang vor anderen Statusstilregeln hat (einschließlich „aktiv“ und „schweben“).
Aus diesem Grund empfiehlt CSS1 die Reihenfolge der Stile:
A:link
A:visited
A:hover
A:active
Eigentlich kann die Reihenfolge der beiden Stile am Anfang sein umgekehrt, da ein Hyperlink nicht gleichzeitig den Status „unbesucht“ und „besucht“ haben kann ( :link bedeutet „unbesucht“; ich weiß nicht, warum es nicht auf diese Weise definiert ist.)
CSS2 erlaubt jetzt Pseudo- Klassen sollen in Form von „verbundenen Gruppen“ angezeigt werden, zum Beispiel:
A:visited:hover {color: maroon;} /* specifity = 2,1 */
A:link:hover { color: magenta ;} /* Specificity = 2,1 */
A:hover:active {color: cyan;} /* Specificity = 2,1 */
Sie haben die gleiche Spezifität, gelten aber für grundsätzlich unterschiedliche Tiere , und so können Sie beispielsweise keine Hover-Active-Kombinationen erhalten. Wie kann man die „Spezifität“ verstehen, die in diesem Artikel enthalten ist? oben:
P.hithere {color: green;} /* specifity = 11 */
P {color: red;} /* specifity = 1 */
Dies scheint eine einfache Operation zu sein, die darauf basiert Dezimal. Der Dezimalalgorithmus kann jedoch nicht zur Berechnung der „Spezifität“ verwendet werden. Wenn Sie beispielsweise 15 Selektoren zusammen verwenden, sind ihre „Spezifitäts“-Gewichtungswerte immer noch niedriger als die des einfachen Klassenselektors. hallo {Farbe: Rot;} /* Spezifität = 10 */
HTML BODY DIV UL LI OL LI UL LI OL LI UL LI OL LI (Farbe: grün;} /* Spezifität = 15 */
" 10 „ist eigentlich eine „1“, gefolgt von „null“, nicht „zehn“. Wir können Hexadezimal verwenden, um die Spezifität der vorherigen Stilregeln zu beschreiben, wie folgt:
.hello {color: red;} / * specifity = 10 */
HTML BODY DIV UL LI OL LI UL LI OL LI UL LI OL LI (Farbe: grün;} /* Spezifität = F */
Das einzige Problem ist, wenn Sie das zweite möchten, wenn Sie hinzufügen Wenn Sie einer Stilregel zwei oder mehr Selektoren hinzufügen, erhalten Sie möglicherweise eine Spezifität von „17“, was erneut zu Verwirrung führt. Tatsächlich kann die Spezifität unendlich sein. Um weitere Verwirrung zu vermeiden, wird empfohlen, die Spezifitätswerte durch Kommas zu trennen.

Webmaster-Vorschlag
: Wiederholen Sie die Berechnung des gewichteten Wertes der Spezifität. Bei der dynamischen Website-Entwicklung ist auch der Status von CSS sehr wichtig mehr Informationen, mehr üben, mehr zu Script Home kommen! Wenn Ihnen diese Seite gefällt, machen Sie bitte Werbung dafür! Vielen Dank fürs Lesen