D'ACCORD.
Donc, dans cette vidéo, nous allons aborder deux sujets importants et voir évaluer que nous n'avons pas vraiment parlé encore et qui sont l'héritage et la spécificité.
Donc, pour commencer, nous allons démontrer la façon dont fonctionne l'héritage et voir évaluer.
J'ai donc un fichier simple ici.
Il a un seul puits avec quatre alliés à l'intérieur et je vais écrire mes styles dans une balise de style juste pour le rendre facile pour vous de regarder vous n'avez pas à me regarder retourner entre les fichiers.
Mais il est toujours préférable de le faire dans une feuille de style externe.
Donc, je vais le style de l'UL et de lui donner une couleur de pourpre et quand je fais que vous verrez que lorsque je rafraîchir les alliés deviennent réellement violet.
Alors ce qui s'est passé là.
Vous savez que j'ai stylé la zone où ils ont appelé l'UL et le mensonge a été indirectement changé et il a hérité de cette couleur de l'élément parent.
Permettez-moi de vous montrer un autre exemple.
Ajoutons juste un paragraphe ici, il commence noir et je vais venir et tout ce vous violet pour l'instant.
Donc, tout est juste texte noir normal.
Je vais faire un peu plus grand si je vais dans mon style et je dis corps et je donne au corps une couleur de couleur rouge et je rafraîchir ce.
Vous verrez que tout est rouge.
Donc, ce n'est que la démonstration de ce concept d'héritage où si nous définissons une propriété sur un parent, il peut également affecter un élément enfant.
Donc, c'est bien si nous voulons faire lire tous les paragraphes et les alliés.
Nous n'avons pas à nous asseoir comme des paragraphes et les faire lire, puis sélectionnez des alliés et de les transformer en rouge.
Nous pouvons simplement sélectionner le corps.
Donc, la prochaine chose que je veux montrer est ce qui se passe si je vais ici et puis je décide qu'un paragraphe je veux vraiment qu'il soit vert.
Si nous rafraîchissons, nous verrons bien sûr que le paragraphe est devenu vert.
De même si je veux que l'ul soit vert ou que nous allons faire bleu et je sauve et rafraîchir l'UL devient bleu et ainsi faire les alliés parce qu'ils héritent de cela.
Donc ce qui se passe ici est en fait démontrer cette idée de spécificité et CSSA.
Donc, nous avons plusieurs styles qui pourraient avoir un impact sur ce même allié.
Il pourrait être rouge et il commence comme le rouge et puis le retourner bleu parce que tout ce que vous êtes censé être bleu.
Donc, si nous allons de l'avant et d'inspecter un de ces éléments et je vais faire ce plein écran et je vais augmenter cela et augmenter la taille de la police un peu trop vous verrez que la couleur est définie en bleu en provenance de Un UL et il nous dit hérité de UL et si nous continuons à défiler vous verrez hérité de corps.
La couleur est rouge, mais il est effectivement rayé et donc cela signifie qu'il n'est pas appliqué du tout.
Et ce style est plutôt appliqué.
Donc, cela nous montre que ce style tente d'être appliqué ou qu'il cible cet élément que nous avons sélectionné, mais il est rayé, ce qui signifie qu'il n'est pas appliqué.
Ainsi, le sujet suivant qui est très étroitement lié à l'héritage est appelé spécificité.
Donc, la spécificité est cette idée dans le sens que nous pouvons avoir plusieurs styles ciblant un élément et qui se passe ici.
Nous avons plusieurs styles ciblant cette UL ou cet allié par exemple.
Le mensonge est devenu rouge ou il est visé par cette ligne.
Corps qui tourne tout dans le corps rouge.
Et il est également visé par cette ligne qui transforme tout dans le tout bleu Juelz.
Et alors, le SS doit décider lequel gagne.
Et dans ce cas, quel que soit le style le plus proche de cet élément.
Donc, celui qui est plus spécifique et donc ce que cela signifie est le corps est très général c'est tout.
Et un UL est plus spécifique que quand il va gagner.
Mais ce n'est qu'un cas simple.
Alors maintenant, montons un peu l'ante et ajou- tez un peu plus de sélecteurs.
Alors allons-y et ajoutez un sélecteur allié direct et faisons un allié orange.
Et comme vous vous attendez, cela rend tous les alliés orange.
Et si nous ouvrons l'inspecteur, nous verrons que le corps le rougit, mais il est rayé.
Il est devenu bleu par le sélecteur UL et puis il est tourné orange par le sélecteur de mouche et que l'on gagne.
Donc, ce sont tous des cas simples où il est assez clair que l'on gagne.
Mais maintenant, nous allons introduire quelque chose en plus de cela.
Disons maintenant que je veux que cela ait une classe appelée mettre en surbrillance et je vais le donner à deux d'entre eux et puis je sélectionne cette classe en surbrillance et je donne une couleur de fond.
En fait, il suffit de rester avec la couleur.
Juste pour que tout soit la même couleur de propriété de jaune et je sauve.
Lequel pensez-vous va gagner maintenant.
Nous allons vérifier et vous pouvez voir que la classe de mise en évidence gagne et il est devenu jaune en raison de cette haute comme la classe.
Donc, cela nous montre quelque chose où, en L.A. Nous ciblons directement tous les alliés et les rendons orange et nous visons également directement quelques alliés qui ont cette classe et qui les rendent jaunes.
Et dans ce cas cette classe gagne.
Il y a donc des règles très précises sur la façon dont cela fonctionne et je vais vous le montrer en seulement une seconde.
Mais avant cela, je veux juste ajouter un autre exemple, alors disons aussi donner à cet élément un I.D. Et je vais l'appeler spécial.
Je vais cibler cet élément spécial et je vais lui donner une couleur de rose et je rafraîchir.
Vous verrez que cet élément gagne.
Et une fois de plus si nous inspectons, vous verrez que nous avons un style du corps qui n'est pas appliqué à partir du puits qui est hérité mais pas appliqué un du mensonge qu'il n'est pas appliqué un de la classe qui n'est pas appliquée.
Et puis un de la spéciale d'identification qui est appliquée.
Donc, dans ce cas, l'ID gagne.
Donc, comme je l'ai mentionné, il ya des règles très spécifiques quant à la façon dont cela fonctionne.
Et je les ai écrites ici.
Mais en fait, je vais aller à M.D et d'abord pour vous montrer qu'ils ont un excellent article sur ce que je vous recommande fortement de lire et il parle de la façon dont la spécificité est calculée.
Donc quand elle voit qu'il ya trois ou quatre couleurs différentes que celui-ci pourrait être.
Comment sait-il qui choisir?
Et la façon dont il le fait effectivement exécute le calcul de sorte qu'il attribue une valeur numérique à chacun de ces sélecteurs.
Donc, il va attribuer une valeur numérique à ce ici et puis à celui-ci et puis à celui-ci et à celui-ci.
Et comme nous le savons, celui-ci gagne.
Donc, la façon dont il est effectivement calculé, nous n'avons pas vraiment à connaître les mathématiques exactes, mais je vais vous le montrer ici.
Il ya une calculatrice que nous pouvons effectivement les choses de type en ligne qui va nous dire comment spécifique quelque chose est.
Donc si je viens de sélectionner tous les alliés, vous verrez qu'il a la spécificité d'un.
Maintenant, essayons de coiffer cette mise en évidence de classe et cela est 10 fois plus spécifique que la spécificité de 10.
C'est pourquoi une classe 1 sur le mensonge.
Et c'est pourquoi cet élément est en fait jaune parce que la classe de souligner gagné sur la couleur orange.
Maintenant, si nous allons et nous ajoutons un I.D.
Ou ce que nous appelons un spécial, vous pouvez le voir qui est 100 fois plus spécifique que juste l'étiquette de la loi.
Pour que l'on gagne et que bat aussi la classe.
Donc, la règle de base ici est que les sélecteurs d'éléments noms de balises ne sont pas des sélecteurs de classe très spécifique sont beaucoup plus spécifiques et les ID sont les plus spécifiques que vous pouvez obtenir.
Et je vais aussi vous montrer que ce n'est pas limité à un seul ID.
Disons que nous voulions savoir ce qui est plus précis.
J'ai une classe et une autre classe à l'intérieur.
Donc, c'est un descendant de Selecta, n'oubliez pas que ce n'est que 20 spécificité.
Et si j'ai juste un seul I.D. C'est une spécificité.
Encore une fois, je ne veux pas que vous pensiez que vous devez utiliser le site tout le temps et calculer les chiffres.
Ce n'est pas important.
Tout ce que vous devez savoir est l'ordre des grandeurs donc je vais aller à mes notes ici et les ont écrites sélecteurs de type sont les moins spécifiques.
Donc cela va ressembler à quelque chose comme ceci ou allié avec un ATF à l'intérieur de celui-ci ou même le sélecteur adjacent.
Ces sélecteurs ne sont donc pas très précis.
Mais même cette année, cela va être plus précis que cela.
Cela va être plus précis que cela aussi parce qu'il ya deux éléments que nous référençons.
Donc, si nous avons effectivement calculé que c'est la spécificité d'un.
Et c'est deux.
Ensuite, le niveau suivant est une classe.
Donc, cela va être un ordre de grandeur 10 fois plus grand ou plus spécifique que n'importe lequel de ceux-ci.
Et ainsi est le sélecteur d'attribut.
Donc, où nous avons des choses comme le type d'entrée est égal au texte et sont donc ces sélecteurs pseudo-classe qui sont des choses comme vol stationnaire.
Donc, une balise sur le vol stationnaire ou d'entrée qui a été vérifiée et d'autres choses comme ça qui ont ce côlon là-bas.
Et puis la chose la plus spécifique est l'I.D. sélecteur.
Donc, cela va être un ordre de grandeur plus ou plus précis que les sélecteurs ici.