Apprendre le lien hypertexte vers la production d'une page Markup_HTML/Xhtml_Web

Q :
J'ai utilisé CSS pour définir le style du lien hypertexte, mais le survol (survol de la souris) ne fonctionne pas lors de la navigation. Pourquoi cela se produit-il ? Est-ce un problème de navigateur ?
Réponse :
Bien que vous pensez que la cause possible est un problème de navigateur, il est plus probable que l'ordre de vos définitions de style soit erroné. Afin de garantir que vous pouvez voir les styles de connexion dans différents états, l'ordre correct des styles doit être :
" lien - visité - survol - actif " ou " LVHA " (abréviation).
Contenu de base :
Chaque sélecteur a une "spécificité". Si deux sélecteurs sont appliqués au même élément, le sélecteur avec la spécificité la plus élevée gagnera et aura la priorité. Par exemple :
P.hithere {color: green;} /* spécificité = 1,1 */
P {color: red;} /* spécificité = 1 */
Toute classe définie class=hithere Le contenu du paragraphe apparaît en vert au lieu de rouge. Les deux sélecteurs définissent la couleur, mais le sélecteur ayant la spécificité la plus élevée l'emportera.
Comment les pseudo-classes affectent-elles la spécificité ? Ils ont exactement la même valeur de pondération, et les styles suivants ont la même valeur de pondération de spécificité :
A:link {color: blue;} /* spécificité = 1,1 */
A:active {color: red ;} /* spécificité = 1,1 */
A:hover {color: magenta;} /* spécificité = 1,1 */
A:visited {color: purple;} /* spécificité = 1, 1*/
Ceci sont des paramètres de style pour les hyperliens. Dans la plupart des cas, il est nécessaire de définir plusieurs styles en même temps. Par exemple, un lien hypertexte non visité peut définir différents styles dans les deux états « survol de la souris » et « activation de la souris » lorsque la souris survole et clique. Les trois règles ci-dessus peuvent toutes être appliquées aux hyperliens, et tous les sélecteurs ont la même spécificité, donc selon les règles, le dernier style « gagne ». Ainsi, le style "actif" ne sera jamais affiché car il est toujours remplacé par le style "survol" (c'est-à-dire que "survol" est prioritaire). Analysons maintenant l'effet du survol de la souris sur un lien hypertexte qui a été visité. Le résultat est toujours violet :(, car son style "visité" a toujours priorité sur les autres règles de style d'état (y compris "actif" et "survol").
C'est pourquoi CSS1 recommande l'ordre des styles :
A:link
A:visited
A:hover
A:active
En fait, le début L'ordre des deux styles peut être inversé, car un lien hypertexte ne peut pas avoir à la fois les états "non visité" et "visité" ( :link signifie " non visité " ; je ne sais pas pourquoi il n'est pas défini de cette façon.)
CSS2 autorise désormais les pseudo- les classes doivent apparaître sous forme de "groupes joints", par exemple :
A:visited:hover {color: maroon;} /* spécificité = 2,1 */
A:link:hover { color: magenta ;} /* spécificité = 2,1 */
A:hover:active {color: cyan;} /* spécificité = 2,1 */
Ils ont la même spécificité, mais ils s'appliquent à des bêtes fondamentalement différentes , et donc pas de conflit. Vous pouvez obtenir des combinaisons actives au survol, par exemple
Comment comprendre la « spécificité » impliquée dans cet article ? La spécificité peut comprendre des caractères numériques qui ne sont pas simplement connectés entre eux. ci-dessus :
P.hithere {couleur : vert;} /* spécificité = 11 */
P {couleur : rouge;} /* spécificité = 1 */
Cela semble être une opération simple basée sur décimal. Cependant, l'algorithme décimal ne peut pas être utilisé pour calculer la « spécificité ». Par exemple, si vous utilisez 15 sélecteurs ensemble, leurs valeurs pondérées de « spécificité » sont toujours inférieures à celles du simple sélecteur de classe. bonjour {couleur : rouge ;} /* spécificité = 10*/
HTML BODY DIV UL LI OL LI UL LI OL LI UL LI OL LI (couleur : vert ;} /* spécificité = 15 */
" 10 "est en fait un "1" suivi de "zéro", et non de "dix". On peut utiliser l'hexadécimal pour décrire la spécificité des règles de style précédentes, comme ceci :
.hello {color: red;} / * spécificité = 10 */
HTML BODY DIV UL LI OL LI UL LI OL LI UL LI OL LI (couleur : vert;} /* spécificité = F */
Le seul problème c'est si tu veux la seconde Quand tu ajoutes deux sélecteurs ou plus à une règle de style, vous pourriez vous retrouver avec une spécificité de "17", ce qui entraînera à nouveau de la confusion. En fait, la spécificité peut être infinie, donc pour éviter toute confusion supplémentaire, il est recommandé d'utiliser des virgules pour séparer les valeurs de spécificité.

Suggestion du webmaster : Répétez le calcul de la valeur pondérée de spécificité. Le paramétrage du CSS du site Web reflète votre capacité à contrôler la page. Dans le développement de sites Web dynamiques, le statut de lecture du CSS est également très important. plus d'informations, pratiquez davantage, venez davantage sur Script Home ! Si vous aimez ce site, faites-en la promotion ! Merci d'avoir lu