1
00:00:00,970 --> 00:00:01,550
OK.

2
00:00:01,590 --> 00:00:10,650
Dus in deze video gaan we twee belangrijke onderwerpen dekken en zie beoordelen dat we echt niet hebben gesproken over nog en die zijn erfenis en specificiteit.

3
00:00:10,650 --> 00:00:15,670
Dus om te beginnen gaan we de manier waarop werkt erfenis te tonen en te zien beoordelen.

4
00:00:15,690 --> 00:00:17,730
Dus ik heb een eenvoudige file hier.

5
00:00:18,000 --> 00:00:30,050
Het heeft een goed met vier bondgenoten binnen en ik ga mijn stijlen in een stijl tag schrijven gewoon het makkelijk voor u om naar te kijken je hoeft niet te kijken me rond schakelen tussen bestanden te maken.

6
00:00:30,210 --> 00:00:33,800
Maar het is altijd beter om dit ook daadwerkelijk te doen op een externe style sheet.

7
00:00:34,560 --> 00:00:51,250
Dus ik ga naar de UL stijl en geef het een kleur van paars en als ik dat doe, dat je zult zien dat wanneer ik de geallieerden te vernieuwen eigenlijk paars geworden.

8
00:00:51,270 --> 00:00:52,570
Dus wat daar gebeurde.

9
00:00:52,620 --> 00:01:01,730
Je weet dat ik het gebied ingericht waar ze de UL vormgegeven en de leugen was indirect veranderd en het geërfd die kleur van het bovenliggende element.

10
00:01:01,830 --> 00:01:04,350
Dus laat ik je een ander voorbeeld van.

11
00:01:05,370 --> 00:01:15,890
Laten we voegen in slechts een paragraaf hier begint zwart en ik ga om te komen en tout dit je wil paars voor nu.

12
00:01:15,900 --> 00:01:18,010
Dus alles is gewoon een normale zwarte tekst.

13
00:01:18,010 --> 00:01:28,980
Ik zal dit een beetje groter te maken als ik in mijn stijl en ik zeg lichaam en ik geven het lichaam een ​​kleur rood en ik vernieuw deze.

14
00:01:29,250 --> 00:01:31,370
U zult zien dat alles is rood.

15
00:01:32,040 --> 00:01:40,720
Dus dit is gewoon het aantonen van dit concept van overerving waar als we een eigenschap is ingesteld op een ouder het kan ook een kind element beïnvloeden.

16
00:01:40,920 --> 00:01:46,310
Dus dit is mooi als we willen dat het alle leden en bondgenoten allemaal lezen.

17
00:01:46,350 --> 00:01:50,540
We hoeven niet te zitten, zoals de punten en zet ze lezen en dan selecteert u bondgenoten en zet ze rood.

18
00:01:50,580 --> 00:01:52,690
We kunnen gewoon kiezen het lichaam.

19
00:01:53,490 --> 00:02:05,980
Dus de volgende ding dat ik wil laten zien is wat er gebeurt als ik ga naar binnen en dan beslissen ik dat een paragraaf ik eigenlijk wil dat het groen zijn.

20
00:02:08,670 --> 00:02:12,630
Als we vernieuwen we zullen zien natuurlijk dat de paragraaf zich tot groen.

21
00:02:12,630 --> 00:02:24,830
Op dezelfde manier als ik wil de ul groen zijn, of laten we het doen blauw en ik spaar en vernieuw de UL wordt blauw en zo ook de geallieerden omdat ze erven van dat.

22
00:02:25,170 --> 00:02:31,040
Dus wat er gebeurt hier eigenlijk aantonen van dit idee van specificiteit en CSSA.

23
00:02:31,680 --> 00:02:36,530
Dus we hebben meerdere stijlen die deze zelfde bondgenoot zou kunnen beïnvloeden.

24
00:02:36,690 --> 00:02:44,220
Het kan rood zijn en het begint als rood en vervolgens terug te blauw omdat alles wat je verondersteld blauw te zijn.

25
00:02:44,700 --> 00:03:09,180
Dus als we doorgaan en controleer één van deze elementen en ik ga deze fullscreen te maken en ik ga dit te verhogen en de lettergrootte een beetje te zul je zien dat de kleur is ingesteld als blauw uit een UL en het vertelt ons geërfd van UL en als we blijven scrollen zie je geërfd van lichaam.

26
00:03:09,300 --> 00:03:15,720
De kleur is rood, maar het is eigenlijk doorgestreept en dus dat betekent dat het in het geheel niet wordt toegepast.

27
00:03:15,720 --> 00:03:17,990
En in plaats van deze stijl wordt toegepast.

28
00:03:18,150 --> 00:03:28,640
Dus dit toont ons deze stijl is een poging om te worden toegepast of deze is gericht op dit element dat we hebben gekozen, maar het is doorgestreept wat betekent dat het niet daadwerkelijk wordt toegepast.

29
00:03:29,850 --> 00:03:35,460
Dus de volgende onderwerp dat zeer nauw verwant is aan successierechten heet specificiteit.

30
00:03:36,030 --> 00:03:44,060
Dus specificiteit is dit idee in de zin dat we meerdere stijlen targeting één element en dat gebeurt hier kan hebben.

31
00:03:44,100 --> 00:03:49,050
We hebben meerdere stijlen gericht op deze ene UL of dit bondgenoot bijvoorbeeld.

32
00:03:49,320 --> 00:03:54,330
De leugen wordt rood gedraaid of het is het doelwit van deze lijn.

33
00:03:54,360 --> 00:03:56,600
Body draaien alles in het lichaam rood.

34
00:03:56,700 --> 00:04:01,840
En het is ook het doelwit van deze lijn, die alles in de hele Juelz blauwe draait.

35
00:04:02,130 --> 00:04:05,310
En dus dan de SS heeft om te beslissen welke wint.

36
00:04:05,370 --> 00:04:10,770
En in dit geval welke stijl het dichtst bij het element.

37
00:04:10,770 --> 00:04:16,930
Dus welke is meer specifieke en dus wat dat betekent is het lichaam is zeer algemeen is het alles.

38
00:04:17,280 --> 00:04:20,560
En een UL is specifieker, dat wanneer het gaat om winnen.

39
00:04:20,910 --> 00:04:22,790
Maar dit is slechts een simpel geval.

40
00:04:22,800 --> 00:04:27,140
Dus laten we nu de ante een beetje en voeg wat meer selectors.

41
00:04:27,330 --> 00:04:35,160
Dus laten we gaan door en voeg in een directe bondgenoot selector en laten we een bondgenoot oranje.

42
00:04:35,820 --> 00:04:39,100
En zoals je zou verwachten het maakt allemaal bondgenoten oranje.

43
00:04:39,180 --> 00:04:47,830
En als we het openstellen van de inspecteur zien we wel het wordt rood gedraaid door het lichaam, maar dat is afgedaan.

44
00:04:48,180 --> 00:04:55,050
Het wordt blauw gedraaid door de UL-selector en het wordt gedraaid oranje door de vlieg selector en dat je wint.

45
00:04:55,050 --> 00:04:59,200
Dus dit zijn allemaal eenvoudige gevallen waarin het is vrij duidelijk welke één wint.

46
00:04:59,400 --> 00:05:02,590
Maar laten we nu eens iets op de top van deze in te voeren.

47
00:05:02,940 --> 00:05:24,950
Laten we nu zeggen dat ik wil dat dit een klasse met de naam hoogtepunt en ik geef het aan twee van hen en selecteer ik deze klasse hoogtepunt en ik geef een achtergrondkleur.

48
00:05:25,120 --> 00:05:26,550
Eigenlijk laten we gewoon stok met kleur.

49
00:05:26,860 --> 00:05:31,090
Net zo is het allemaal hetzelfde terrein kleur van geel en ik spaar.

50
00:05:31,090 --> 00:05:33,040
Welke denk je dat er gaat nu winnen.

51
00:05:33,610 --> 00:05:41,910
Laten we eens kijken en je kunt zien dat het hoogtepunt klasse overwinningen en het is ingeschakeld geel vanwege die hoge als klasse.

52
00:05:42,370 --> 00:05:53,960
Dus dit toont ons iets, waar in L.A. We zijn direct alle bondgenoten targeting en waardoor ze oranje en dan zijn we ook direct gericht op een paar bondgenoten dat deze klasse hebben en waardoor ze geel.

53
00:05:54,190 --> 00:05:56,960
En in dit geval deze klasse wint.

54
00:05:57,370 --> 00:06:02,100
Er zijn dus eigenlijk heel specifieke regels voor hoe dit werkt en ik ga om te laten zien aan u in slechts een seconde.

55
00:06:02,140 --> 00:06:13,520
Maar voordat dat ik wil gewoon een voorbeeld toe te voegen in dus laten we zeggen dat geven ook dit element een I.D. en ik ga om het speciaal noemen.

56
00:06:13,610 --> 00:06:22,320
Ik ga dat element speciaal richten en ik ga het een kleur van roze geven en ik vernieuwen.

57
00:06:22,330 --> 00:06:24,760
Je zult zien dat dit element wint.

58
00:06:24,850 --> 00:06:39,430
En nog een keer als we inspecteren je zult zien dat we een stijl uit het lichaam dat niet wordt toegepast één uit de put dat is geërfd, maar niet toegepast één van de leugen dat het niet wordt toegepast één van de klasse die niet wordt toegepast.

59
00:06:39,520 --> 00:06:43,660
En daarna één van de speciale ID die wordt toegepast.

60
00:06:43,750 --> 00:06:46,790
Dus in dit geval de ID wint.

61
00:06:47,020 --> 00:06:50,490
Dus zoals ik al zei zijn er zeer specifieke regels over hoe dit werkt.

62
00:06:50,830 --> 00:06:52,690
En ik heb ze hier opgeschreven up.

63
00:06:52,840 --> 00:07:02,320
Maar eigenlijk ga ik naar M.D en de eerste om te laten zien dat ze een leuk artikel over dit dat ik u aanbevelen om te lezen en er wordt gesproken over de manier waarop de specificiteit wordt berekend.

64
00:07:02,320 --> 00:07:08,440
Toen ze ziet dat er drie of vier verschillende kleuren dat dit zou kunnen zijn.

65
00:07:08,560 --> 00:07:10,540
Hoe werkt het weet welke te kiezen.

66
00:07:10,810 --> 00:07:19,210
En de manier waarop het eigenlijk doet het loopt de berekening dus het kent een numerieke waarde toe aan elk van deze kiezers.

67
00:07:19,420 --> 00:07:27,180
Dus het gaat om een ​​numerieke waarde hier en dan naar deze ene en vervolgens toewijzen aan deze naar deze ene en deze.

68
00:07:27,220 --> 00:07:30,180
En zoals we weten dat dit één wint.

69
00:07:30,250 --> 00:07:37,640
Dus de manier waarop het daadwerkelijk wordt berekend we eigenlijk niet hebben om de exacte wiskunde weten, maar ik zal het hier laten zien.

70
00:07:37,720 --> 00:07:44,470
Er is een rekenmachine die we eigenlijk dingen in online die ons zal vertellen hoe specifiek iets kunt typen.

71
00:07:44,800 --> 00:07:51,920
Dus als ik alle bondgenoten selecteer gewoon je zult zien dat het beschikt over de specificiteit van één.

72
00:07:51,940 --> 00:07:59,810
Laten we nu eens proberen slutting die klasse hoogtepunt en dat is 10 keer zo specifiek de specificiteit van 10.

73
00:08:00,040 --> 00:08:04,380
Dus dat is de reden waarom een ​​klasse 1 uit over de leugen.

74
00:08:04,390 --> 00:08:12,510
En dat is de reden waarom dit element is eigenlijk geel omdat die klasse hoogtepunt won uit over de oranje kleur.

75
00:08:13,180 --> 00:08:15,430
Als we nu gaan en we voegen een I.D.

76
00:08:18,430 --> 00:08:24,660
of wat we een speciale oproep kun je zien dat is 100 keer meer specifiek dan alleen de wet tag.

77
00:08:24,790 --> 00:08:28,540
Zodat men wint en dat klopt ook de klas.

78
00:08:28,540 --> 00:08:41,340
Dus de basisregel is dat element selectors tag namen zijn niet erg specifiek class selectors zijn veel specifieker en dan id zijn de meest specifieke die je kunt krijgen.

79
00:08:41,650 --> 00:08:44,920
En ik zal je ook laten zien dat het niet alleen beperkt tot één ID.

80
00:08:44,950 --> 00:08:48,330
Dus laten we zeggen dat we wilden weten wat specifieker.

81
00:08:48,340 --> 00:08:53,320
Ik heb een klasse en een andere klasse binnen van het.

82
00:08:53,320 --> 00:08:59,170
Dus dit is een afstammeling Selecta vergeet niet dat dit slechts 20 specificiteit.

83
00:08:59,530 --> 00:09:05,160
En als ik slechts een enkele I.D. Dat is 100 specificiteit.

84
00:09:05,170 --> 00:09:10,120
Dus nogmaals, ik wil niet dat je om te denken dat je nodig hebt om te worden met behulp van de site de hele tijd en het berekenen aantallen.

85
00:09:10,180 --> 00:09:11,440
Dat is niet belangrijk.

86
00:09:11,440 --> 00:09:19,930
Alles wat u moet weten is de volgorde van de grootheden, dus ik ga naar mijn aantekeningen hier en hebben ze opgeschreven soort selectors zijn het minst specifiek.

87
00:09:19,930 --> 00:09:30,580
Dus dat gaat om te kijken als iets als dit of bondgenoot met een ATF erin of zelfs de aangrenzende selector.

88
00:09:30,700 --> 00:09:34,190
Dus deze selectors zijn niet zeer specifiek.

89
00:09:34,330 --> 00:09:38,860
Zelfs binnen dit jaar dit gaat specifieker dan dit zijn.

90
00:09:38,890 --> 00:09:44,050
Dit gaat en omdat er twee elementen die we verwijzen specifieker dan dit zijn.

91
00:09:44,200 --> 00:09:47,360
Dus als we daadwerkelijk berekende het is dit specifieke karakter van één.

92
00:09:47,530 --> 00:09:48,850
En dat is twee.

93
00:09:49,570 --> 00:09:52,780
Dan is het volgende niveau een klasse.

94
00:09:53,890 --> 00:10:01,610
Dus dit gaat om een ​​orde van grootte 10 keer groter of specifieker dan een van deze zijn.

95
00:10:02,320 --> 00:10:04,380
En zo is het attribuut selector.

96
00:10:04,420 --> 00:10:19,660
Dus waar hebben we dingen als input type is gelijk aan de tekst en dus zijn deze pseudo-class selectors die dingen zoals hover zijn.

97
00:10:19,750 --> 00:10:27,360
Dus een tag op hover of ingang die is gecontroleerd en andere dingen als dat dat dit colon daar.

98
00:10:28,060 --> 00:10:31,890
En dan is het zeer meest specifieke ding is de I.D. selector.

99
00:10:32,230 --> 00:10:38,260
En dus dat gaat naar een andere orde van grootte groter of meer specifiek dan de selectors hier te zijn.