1
00:00:00,230 --> 00:00:03,290
Weet alles wat we echt nodig hebben om zich te concentreren op zijn de kleuren.

2
00:00:03,300 --> 00:00:05,160
Laten we beginnen met een jumbotron.

3
00:00:05,460 --> 00:00:37,880
Dus alles in het JumboTron is net een andere tint van blauw en die schaduw van blauw Ik heb in dit document hier om te zien 3 5 0 zal gaan naar onze style sheet en we kunnen gewoon selecteert u de jumbotron en geef het een kleur en alles binnen van het allemaal op die kleur, net als dat zijn vers en u kunt zien is alles veranderd blauw te zijn met inbegrip van de klif A-Kon het pictogram glyph is gewoon behandeld als tekst.

4
00:00:37,980 --> 00:00:43,010
Het is eigenlijk een lettertype, zodat u de kleur van het kan veranderen met de eigenschap kleur.

5
00:00:43,020 --> 00:00:45,950
Laten we nu eens aanpakken van de nav bar die is een beetje lastiger.

6
00:00:46,110 --> 00:00:47,730
De achtergrondkleur is niet slecht.

7
00:00:47,740 --> 00:00:53,280
Alles wat we moeten doen is kiezen nav bar Inv. of we konden doen.

8
00:00:53,340 --> 00:01:08,210
Nu als we op na onze fix stop, maar ik zal nav bar omgekeerde doen en dan geef het een achtergrondkleur van die blauwe achtergrond en plak deze in en vernieuwen.

9
00:01:08,210 --> 00:01:09,830
En je kunt zien verandert blauw te zijn.

10
00:01:10,020 --> 00:01:15,900
Maar om de kleur te veranderen Ik wil dat ze wit zijn in plaats van dat grijs dat ze.

11
00:01:15,900 --> 00:01:22,800
Als ik de stijl gewoon allemaal inkt of labels dat is wat deze zijn voor slechts stijl anker tags wit zijn het zal niet helemaal werk.

12
00:01:22,800 --> 00:01:23,980
Dus ik zal je laten zien wat ik bedoel.

13
00:01:24,030 --> 00:01:28,070
Ankertag kleur wit.

14
00:01:28,150 --> 00:01:29,630
Ga terug.

15
00:01:29,910 --> 00:01:35,430
Het heeft geen effect te nemen en dit is een groot nut voor de inspecteur als we inspecteren.

16
00:01:35,610 --> 00:01:36,880
Kijk wat er gebeurt.

17
00:01:37,260 --> 00:01:43,080
Dus we kunnen zien dat onze kleur wit wordt afgedaan en de kleur wordt hier toegewezen.

18
00:01:43,410 --> 00:01:50,050
Deze lijn kleur is deze grijze en als we het vinkje dat ze gaan terug naar zijn de witte, dat we willen dat ze zijn.

19
00:01:50,490 --> 00:01:53,280
En dat komt omdat dit is een meer specifieke selector.

20
00:01:53,460 --> 00:01:56,290
Als je terug naar die les die ik deed op specificiteit kan denken.

21
00:01:56,520 --> 00:02:06,530
Dit wordt berekend op een hogere waarde of een hogere specificiteit index dan wat we hier hadden die up is alleen voor kleine ankercode versus deze hier.

22
00:02:06,630 --> 00:02:08,190
Het is meerdere klassen.

23
00:02:08,190 --> 00:02:12,330
Vergeet niet elk van die is tien keer meer specifieke dan alleen een anchor tag.

24
00:02:12,900 --> 00:02:19,540
Dus wat we willen doen is schrijven een selector die net zo specifiek zal zijn en we kunnen gewoon stelen deze hier.

25
00:02:20,280 --> 00:02:25,910
Dus we gaan om hier en plak deze in en dan veranderen kleur wit te zijn.

26
00:02:25,950 --> 00:02:29,560
Dus we gewoon negeren exact dezelfde schlechter dat Bootstrap gehad.

27
00:02:29,610 --> 00:02:37,370
En het is belangrijk dat onze stijlen optreden na bootstrap, zodat we het kunnen negeren en als we zijn vers krijgen we nu witte banden.

28
00:02:37,650 --> 00:02:41,050
Tot slot zullen we hetzelfde met de nav bar merk doen.

29
00:02:41,670 --> 00:02:45,490
Dus zoals je kunt zien dat er binnen in navigatiebalk dash merk.

30
00:02:45,960 --> 00:02:59,800
Als we selecteren die Daut nu voor ons merk en geven we dat een kleur wit en op te slaan en terug te gaan het nog steeds niet werkt en we hebben hetzelfde probleem.

31
00:02:59,820 --> 00:03:11,700
Dus als we inspecteren je zult zien dat het onze stijlen is overgestoken hier af naar beneden waar we heen draaien wit is afgedaan en is eerder kleuren worden veranderd door deze lijn.

32
00:03:11,700 --> 00:03:17,770
Nu als Bar merk binnenkant van nav bar Inv. dus we kunnen ook gewoon stelen dat en overschrijf dat.

33
00:03:17,970 --> 00:03:21,500
Dus we hoeven alleen maar dat nav bar inv ..

34
00:03:21,930 --> 00:03:23,220
Nu is voor ons merk.

35
00:03:23,280 --> 00:03:32,580
Dus eigenlijk zijn we het schrijven van stijlen die gaan head to head botsen in een strijd van de stijlen tussen bootstrap en onze stijlen en ze zijn identiek in de selectors.

36
00:03:32,700 --> 00:03:36,280
Dus omdat ons komt op de tweede ze gaan komen op de top.

37
00:03:36,300 --> 00:03:41,100
Ze gaan om te winnen terug te gaan vernieuwen en nooit meer gaan.

38
00:03:41,100 --> 00:03:42,530
We hebben de meeste van de stijlen gedaan.

39
00:03:42,630 --> 00:03:51,600
Er is een heel klein ding dat u waarschijnlijk niet in de gaten op het scherm wierp de kleur van grijs op de JumboTron is ooit zo iets anders.

40
00:03:52,740 --> 00:04:05,510
Dus ik heb die kleur hier Ik kom net kopiëren en ga dan naar RC SS en we zullen verander gewoon de achtergrond van de Jumbotron dat grijs gekleurd zijn en besteden veel aandacht als refresh.

41
00:04:05,520 --> 00:04:07,000
Hopelijk kunt u zien veranderen.

42
00:04:07,110 --> 00:04:08,200
Het is gewoon veranderd.

43
00:04:08,200 --> 00:04:10,990
Het is een iets blauwere naar grijs.

44
00:04:11,040 --> 00:04:12,500
Dus laten we testen alles uit.

45
00:04:12,720 --> 00:04:16,080
Laten we het formaat van onze NAV bar werk.

46
00:04:16,170 --> 00:04:18,720
De Javascript werkt prima.

47
00:04:18,720 --> 00:04:19,740
Daar gaan we.

48
00:04:19,830 --> 00:04:21,400
Alles ziet er goed uit.

49
00:04:21,420 --> 00:04:24,870
Het laatste wat ik zal je laten zien is hoe we een ander pictogram hier kunnen gebruiken.

50
00:04:25,140 --> 00:04:31,860
Degene die ik gebruik is van een bibliotheek genaamd leuke ontzagwekkende fun geweldig is een eenvoudige bibliotheek die een heleboel verschillende pictogrammen bevat.

51
00:04:31,860 --> 00:04:37,520
Veel meer dan de ingebouwde Bootstrap met pictogrammen, zodat u bij Funt geweldig om het te krijgen.

52
00:04:37,610 --> 00:04:38,390
Haar niet krijgen.

53
00:04:38,430 --> 00:04:40,890
Ik weet dat ik op de home page hier.

54
00:04:41,280 --> 00:04:47,220
En als we klik op de pictogrammen zijn er meer dan 580 verschillende pictogrammen kunt u ze hier allemaal te zien.

55
00:04:47,550 --> 00:04:53,580
En een van de leuke functies die u kunt zoeken door middel van hen, die kun je niet echt te doen op Pucelle heel gemakkelijk.

56
00:04:53,670 --> 00:05:01,870
Dus we kunnen zoeken naar foto en krijgen we de camera en de camera retro dat is wat ik gebruikte.

57
00:05:02,100 --> 00:05:05,180
Maar voordat we een van hen kunnen gebruiken moeten we om het te installeren.

58
00:05:05,400 --> 00:05:07,750
Dus als je naar de slag.

59
00:05:07,800 --> 00:05:14,160
Ze hebben een mooie CDN dat je gewoon kunt kopiëren en zet die binnenkant van je applicatie.

60
00:05:14,160 --> 00:05:18,650
Dus we zullen dat doen op bovenkant betalen plotselinge.

61
00:05:19,140 --> 00:05:24,190
En nu kunnen we plezier geweldig iconen te gebruiken en het is echt heel eenvoudig.

62
00:05:24,330 --> 00:05:35,100
Eigenlijk als je klikt op een pictogram dat u wilt dat zeggen dat ik wil het vredesteken ik kan erop klikken gebruiken en ze geven je het kleine stukje code die u kunt kopiëren.

63
00:05:35,100 --> 00:05:38,300
Dus het is een icoon met klasse gelijk is aan f een voor de lol.

64
00:05:38,310 --> 00:05:38,660
Geweldig.

65
00:05:38,670 --> 00:05:42,010
En dan F. A. dash de naam van het pictogram.

66
00:05:42,990 --> 00:05:51,870
Laten we gewoon de plaats van de camera-icoontje met deze, zodat het een groot vredesteken zal redden en te vernieuwen zal hebben.

67
00:05:52,380 --> 00:05:53,640
En we hebben een vredesteken.

68
00:05:53,850 --> 00:05:55,820
Zo leuk geweldig is pretty awesome.

69
00:05:55,830 --> 00:05:57,110
Het is echt populair.

70
00:05:57,120 --> 00:06:01,970
Veel van de grote iconen als je kunt vrijwel elk pictogram dat u ooit nodig zou hebben te zien.

71
00:06:01,980 --> 00:06:03,620
Ze hebben een heleboel van de standaard zijn.

72
00:06:03,690 --> 00:06:04,940
Pauze play-knop.

73
00:06:04,950 --> 00:06:09,400
Doorsturen achteruit verschillende pictogrammen voor technologie en verschillende Internet pictogrammen.

74
00:06:09,480 --> 00:06:12,260
Maar ze hebben ook wat meer plezier degenen zoals vredestekens.

75
00:06:12,320 --> 00:06:16,090
En ik denk dat ze hebben ook een Spock kant Yep daar gaan we.

76
00:06:16,380 --> 00:06:19,460
Zo kunt u een van deze te gebruiken net zoals je elk ander lettertype te gebruiken.

77
00:06:19,500 --> 00:06:24,130
Dus als je wilt de kleur te veranderen u verander gewoon de eigenschap kleur als je wilt om de grootte te veranderen.

78
00:06:24,360 --> 00:06:26,510
Je eigenlijk veranderen lettergrootte.

79
00:06:26,880 --> 00:06:44,880
Dus ik ga gebruiken die retro camera zoeken naar dat weer wat camera dash retro, dus ik moet een streepje camera vleugje retro doen en op te slaan refresh en we krijgen die retro camera.

80
00:06:44,880 --> 00:06:46,710
Oké dus we zijn klaar met de galerij.

81
00:06:46,710 --> 00:06:52,370
Afgezien van het beeld daadwerkelijk te veranderen ben je anders dat ik, zodra ik klaar ben met deze wrap up zal doen.

82
00:06:52,380 --> 00:06:56,310
U heeft waarschijnlijk niet willen anyways te kijken maar in het geval heb je zal ik het onder meer aan het eind.

83
00:06:56,310 --> 00:07:04,110
Dus we hebben genoeg Bartra hier maakte een kleine verandering die we gebruiken nu veel inverse dat is hoe we de zwarte en witte nav bar.

84
00:07:04,230 --> 00:07:07,650
Maar toen we in feite verandert kleuren toch dus het deed er niet echt toe.

85
00:07:07,650 --> 00:07:12,380
En dan hebben we ook gebruik gemaakt nav bar vaste top dat is hoe het omhoog blijft aan de top.

86
00:07:12,480 --> 00:07:16,100
We maken gebruik van een grid-systeem hier beneden en dan gebruiken we een jumbotron.

87
00:07:16,100 --> 00:07:20,960
Ik introduceerde glyph een concept gebouwd in Bootstrap pictogrammen die relatief beperkt zijn.

88
00:07:21,000 --> 00:07:29,000
Er zijn de meeste van de dingen die je zou gebruiken, maar zo nu en dan zullen ze niet iets hebben of soms heb je gewoon liever de manier waarop de pret ontzagwekkende pictogrammen kijk plezier.

89
00:07:29,010 --> 00:07:41,700
Awesome is zeker meer populair dan het eten show met pecannoten en de andere nieuwe wat ik liet zien was de verkleinde klasse die je net om een ​​beeld kunt zetten en het zal beperken dat de afbeelding in een raster en hier toe dit leuke kleine grens.

90
00:07:41,700 --> 00:07:48,520
En dan tot slot hebben we gesproken over de specificiteit en hoe we moesten de bootstrap stijlen vechten als we wilden om de kleur te veranderen de achtergrondkleur.

91
00:07:48,620 --> 00:07:54,180
Wil je de achtergrondkleur van Nav veranderen. of de tekstkleur voor de links en ook de kleur van de Nev.

92
00:07:54,210 --> 00:07:55,450
merk hier.

93
00:07:55,620 --> 00:07:57,410
OK dus dat is het in de volgende video.

94
00:07:57,420 --> 00:08:00,230
Ik ga je laten zien hoe we een landing page kan maken met bootstrap.

95
00:08:00,300 --> 00:08:05,590
En zoals ik beloofd dat ik ga nu te kopiëren en te plakken gaan deze afbeelding links naar negen verschillende beelden hier te maken.

96
00:08:05,760 --> 00:08:09,160
Dus als dat is iets wat je wilt zien hangen rond voor de volgende minuut of twee.

97
00:08:09,660 --> 00:08:13,380
OK.

98
00:08:15,510 --> 00:08:28,760
Dus ik zal gewoon split screen dit en ik zal een aantal van deze meer dan dit eerste exemplaar en ik ga gewoon deze ene hier te vervangen en dan zal ik het volgende doen.

99
00:08:29,140 --> 00:08:29,580
Old Place.

100
00:08:29,580 --> 00:08:31,360
Deze hier.

101
00:08:32,610 --> 00:08:47,350
En dan de volgende degene die ik weet zeker dat dit is meeslepend en ik zal blijven gaan naar beneden de lijn net als dat.

102
00:08:47,350 --> 00:08:48,660
Oké we zijn voorbij halfweg.

103
00:08:48,660 --> 00:09:11,440
We zijn er bijna en de laatste die ik denk dat we het laten we zeggen ervoor te zorgen dat alles ziet er goed of vers en we hebben negen verschillende beelden.

104
00:09:11,700 --> 00:09:12,360
Geweldig.

105
00:09:12,660 --> 00:09:12,960
Okee.

106
00:09:12,960 --> 00:09:14,120
Dus nu ben ik klaar gedaan.

107
00:09:14,190 --> 00:09:16,020
Hopelijk genoten van het maken van die image gallery.

108
00:09:16,050 --> 00:09:17,060
Ik zie je in de volgende video.