1
00:00:00,780 --> 00:00:06,390
Dus de volgende up laten gaan en gewoon dupliceren dit markup dat is alles wat ik hier deed.

2
00:00:06,720 --> 00:00:12,690
Ik heb gebruikt iets andere woorden iets anders bacon ipsum tussen deze paragrafen.

3
00:00:12,810 --> 00:00:19,310
Dus ik zal gewoon deze twee meer dan kopiëren in de h t m l Maar nogmaals, dat is niet de focus hier.

4
00:00:19,350 --> 00:00:26,340
Dus wat we willen weer zorg ervoor dat laten we dit gewoon vanaf nul, dus het is div class is gelijk aan berichten.

5
00:00:26,850 --> 00:00:33,870
En sommigen van u misschien wel af waarom ik eens de moeite genomen te zetten div een div met klasse evenaart record rond alles.

6
00:00:33,900 --> 00:00:35,710
Dit zou prima werken zonder dat.

7
00:00:35,820 --> 00:00:37,880
Het is echt alleen over het bundelen van de dingen.

8
00:00:38,100 --> 00:00:42,810
Ik zou liever dan het hebben van een gigantische puinhoop waar men blog post bloedt in een andere.

9
00:00:42,810 --> 00:00:52,910
Ik willen hebben dingen doen, die een klein beetje, zodat ik weet dat dit een post en het eindigt hier, dus het is meer zo ongeveer in mijn mening het houden van de code een beetje schoon.

10
00:00:53,340 --> 00:01:05,530
Dus dan wilden we een div genaamd datum of klassieke datum te hebben en die datum is 11 december 2015.

11
00:01:05,820 --> 00:01:07,750
Behalve dat.

12
00:01:07,830 --> 00:01:12,640
Dan hadden we een H2 en dat H-2.

13
00:01:12,720 --> 00:01:18,510
Dit is een ander artikel dat een ander artikel verschrikkelijk.

14
00:01:18,840 --> 00:01:19,950
Niet aan te raden dat je het leest.

15
00:01:19,950 --> 00:01:21,490
Het is zowat spek.

16
00:01:21,780 --> 00:01:25,500
Dus ik ga gewoon verder te gaan en opnieuw te kopiëren dit citaat.

17
00:01:25,830 --> 00:01:26,990
Dat is een paragraaf.

18
00:01:27,060 --> 00:01:30,490
Klasse evenaart citaat pasta die in.

19
00:01:30,630 --> 00:01:32,870
En dan hebben we nog twee alinea's hier.

20
00:01:33,130 --> 00:01:40,800
Eén en tenslotte het laatste beetje markup die we nodig hebben.

21
00:01:40,800 --> 00:01:42,000
De tweede paragraaf.

22
00:01:42,000 --> 00:01:43,950
Daar gaan we.

23
00:01:44,640 --> 00:01:49,000
Dus laten we eens kijken hoe dit eruit ziet.

24
00:01:49,080 --> 00:01:54,910
Dus een ding dat ik ben te merken is dat we een beetje minder ruimte tussen de berichten hier.

25
00:01:54,960 --> 00:01:56,760
Dus dit een net loopt in deze.

26
00:01:56,760 --> 00:02:05,220
De datum 11 december willen wij zeker een beetje afstand er zoals we kunnen zien in het linker deel van die zou kunnen zijn omdat de HRR die we missen.

27
00:02:05,220 --> 00:02:09,020
Hoewel ik denk dat wat we moeten doen is gewoon toe te voegen in een aantal marge tussen de blog posts.

28
00:02:09,150 --> 00:02:11,780
Dus laten we beginnen met het verkrijgen van deze h r in.

29
00:02:12,570 --> 00:02:15,690
Dus we hebben niet echt gezien de H R element echt in de praktijk.

30
00:02:15,690 --> 00:02:19,410
Het is een zeer eenvoudig te gebruiken net ziet er zo uit.

31
00:02:19,410 --> 00:02:27,540
Het is eigenlijk zelfsluitende niets het is het geen afsluitende tag of een innerlijke inhoud slechts een char horizontale lijn moest doen.

32
00:02:27,540 --> 00:02:30,200
Als we vernieuwen wat je zult zien.

33
00:02:30,210 --> 00:02:35,940
Dus dat geeft ons deze lijn over te gaan en die normaal is prima.

34
00:02:35,940 --> 00:02:40,830
De meeste mensen wel graag stijl die een beetje dus dit is echt zwak.

35
00:02:40,950 --> 00:02:52,310
Ik weet niet of u kunt vertellen, maar het is eigenlijk een beetje dikker en vervolgens achterstand op de randen en er zijn enkele grote middelen en dingen op de lijn die je kunt gebruiken om elke char stylen.

36
00:02:52,410 --> 00:03:00,840
En de reden dat ze deze toegevoegde in hier is dat ik wilde je dwingen om iets op te kijken en om te proberen om een ​​aantal stijlen die je niet zelf hebt moeten noteren.

37
00:03:00,840 --> 00:03:04,830
Dus ik ga u precies laten zien wat ik zou doen om een ​​aantal H R stijlen.

38
00:03:04,830 --> 00:03:09,170
Ik zou alleen Google HDR stijl en zien wat we krijgen.

39
00:03:09,390 --> 00:03:13,320
En je kunt zien dat ik heb eigenlijk klikte op twee van hen voor.

40
00:03:13,890 --> 00:03:20,280
Dus we hebben eenvoudige stijlen gekregen voor elke potten en je kunt zien dat er een paar opties hier.

41
00:03:20,460 --> 00:03:23,290
Dus ze denken dat dit is degene die ik ging met hier.

42
00:03:23,550 --> 00:03:25,980
Maar laten we proberen een als deze.

43
00:03:25,980 --> 00:03:31,440
Klik op de code en alles wat we moeten doen is te kopiëren deze.

44
00:03:31,440 --> 00:03:36,780
Dit zijn twee stijlen en kopieer deze naar beneden en wij niet.

45
00:03:36,900 --> 00:03:45,460
Ik wil niet te denken dat je nodig hebt om elke regel te begrijpen hier, want dit is een aantal dingen dat is vrij geavanceerde en soort hacky zoals je kunt zien deze persoon zegt.

46
00:03:45,480 --> 00:03:57,600
Niet echt geacht te werken maar wel het enige dat we willen doen is ervoor zorgen dat deze zullen worden gekozen voor onze H R en dus wat dit doet is laten HRO met klasse van stijl 7, die we niet hebben.

47
00:03:57,870 --> 00:04:06,670
Dus laten we kiezen gewoon een char en laten we zien hoe dit eruit ziet.

48
00:04:06,690 --> 00:04:08,120
Ververs de pagina.

49
00:04:08,150 --> 00:04:09,270
OK dus daar gaan we.

50
00:04:09,360 --> 00:04:11,400
Dus ik persoonlijk niet schelen voor die ene.

51
00:04:11,430 --> 00:04:14,700
Ik ga naar deze ene hier dat soort paden af ​​te gebruiken.

52
00:04:14,700 --> 00:04:17,240
Voel je vrij om te doen wat je wilt en te spelen rond met het.

53
00:04:17,610 --> 00:04:25,420
Maar nogmaals, het punt was dat ik wilde dat je om te proberen iets externe dat je niet schrijven vinden en ik wil je laten zien dat het helemaal prima om dat te doen.

54
00:04:25,560 --> 00:04:27,100
Dus ik ben gewoon het kopiëren van deze in.

55
00:04:27,270 --> 00:04:29,220
Ik heb dit niet schrijven.

56
00:04:29,500 --> 00:04:34,520
Noodzaak om zich te ontdoen van deze stijlen hier en zet deze in.

57
00:04:35,400 --> 00:04:46,370
Dus alles wat ze doen is ziet het lijkt erop dat ze het instellen van een grens aan de HRO dus geen grens hoogte, die vervolgens wordt dit beeld De achtergrond die een gradiënt slechts één pixel en.

58
00:04:46,550 --> 00:04:48,870
En dus dat is hoe ze dat gradient effect te krijgen.

59
00:04:48,870 --> 00:04:51,970
Dus als we frissen er nu ga je.

60
00:04:52,110 --> 00:04:55,710
We hebben dit mooie gradiënt effect hier en als we wilden.

61
00:04:55,710 --> 00:04:59,530
Ik eigenlijk liever dit, dus ik ga gewoon door te gaan en houdt deze.

62
00:04:59,760 --> 00:05:00,350
Over dit.

63
00:05:00,350 --> 00:05:05,380
Ik zou de kleur te veranderen een beetje, zodat het een lichter grijs, maar laten we gewoon houden dat voor nu.

64
00:05:05,580 --> 00:05:13,090
Maar we hebben nog steeds dit probleem, dat is ons onze volgende blog post begint te snel en we moeten wat ruimte er toe te voegen.

65
00:05:13,410 --> 00:05:17,940
Dus alles wat we moeten doen is voeg een beetje een marge.

66
00:05:18,360 --> 00:05:31,090
Dus dit is eigenlijk een mooi een mooi toeval dat we deze blogpost wrapper rond elk bericht omdat we een marge kan het gewoon toe te voegen aan de onderkant van elke post, zodat de ruimte hier zal toevoegen.

67
00:05:32,220 --> 00:05:34,210
Dus alles wat we moeten doen is kiezen.

68
00:05:34,230 --> 00:05:36,560
Laat ik je gewoon de class post.

69
00:05:36,630 --> 00:05:37,810
Dat is een record.

70
00:05:38,160 --> 00:05:39,580
Dus dan zijn we gewoon hier te gaan.

71
00:05:39,670 --> 00:05:50,370
Het is net na de marge en laten we het doen 20 pixels en niet alleen marge.

72
00:05:50,490 --> 00:05:59,600
Laten we het gewoon doen op de bodem, zodat alleen maart en bottom vernieuwen en dat op zoek is aardig in de buurt.

73
00:06:00,210 --> 00:06:15,140
Dus de laatste klein probleem hier is dat we hebben een beetje meer ruimte hier dan we hier doen en dat komt omdat dit of dat we hebben toegevoegd is eigenlijk buiten de post klasse, dus het is niet te worden beïnvloed door die marge die we toegevoegd.

74
00:06:15,150 --> 00:06:19,490
Dus als we dat deden we gewoon bewegen de A char.

75
00:06:19,500 --> 00:06:20,160
Waar is dat.

76
00:06:20,160 --> 00:06:25,510
Daar gaan we naar de bodem van de post en we zijn vers.

77
00:06:25,590 --> 00:06:27,960
U kunt zien of we de afstand die we willen krijgen.

78
00:06:28,600 --> 00:06:37,730
OK dus als we wilden experimenteren en krijgen exact dit zouden we gewoon terug naar die H.R. stijlen en probeer een aantal van de andere.

79
00:06:37,890 --> 00:06:41,970
Maar wat ik echt wil opnieuw tonen is dat we andere stijlen kunnen nemen in.

80
00:06:42,010 --> 00:06:48,080
We hebben niet echt precies weten hoe ze werken, hoewel het een goed idee om nieuwsgierig te zijn en om te proberen het uit.

81
00:06:48,930 --> 00:06:53,790
Dus hopelijk je genoten hebt van het maken van dit project om mooie eenvoudige minimale blog en voor nu.

82
00:06:53,790 --> 00:06:56,430
Uiteraard is het niet daadwerkelijk functioneert als een blog.

83
00:06:56,430 --> 00:07:01,390
Er zijn geen opmerkingen die we kunnen niet in een nieuwe functie toe te voegen met een soort van interface.

84
00:07:01,470 --> 00:07:20,840
We moeten eigenlijk bewerken het uit onszelf in de leeftijd hem, maar als we in javascript en wanneer in het bijzonder en we naar de back-end en we hebben een database en we hebben een server die in een kader genaamd Express we eigenlijk van plan om deze blog te nemen en zet hem in een echte blog waar we een post kunnen toevoegen met behulp van een formulier kunnen wij commentaar en kunnen we een aantal andere dingen te doen, zoals stemming.

85
00:07:21,060 --> 00:07:22,410
Dus dat gaat echt spannend.

86
00:07:22,410 --> 00:07:24,350
We gebruiken dit jou te evalueren het.

87
00:07:24,360 --> 00:07:28,540
Het is vrij aardig op zoek naar relatief weinig regels.