1
00:00:00,760 --> 00:00:01,370
OK.

2
00:00:01,620 --> 00:00:05,960
Dus in deze video gaan we deze Tic Tac Toe boord oefening van de grond af opnieuw.

3
00:00:06,060 --> 00:00:09,120
Dus we gaan om te beginnen vanaf het begin met een leeg bestand.

4
00:00:09,130 --> 00:00:13,880
Ik Coppermine bord dat HVM Ik kan aan onze ketel plaat.

5
00:00:14,460 --> 00:00:21,210
Gewoon gaan noemen T T T raad van bestuur en de manier waarop dit werkt alleen maar om je geheugen te joggen.

6
00:00:21,420 --> 00:00:22,550
Het is een tafel.

7
00:00:22,560 --> 00:00:23,950
Deze hele zaak is een tafel.

8
00:00:24,000 --> 00:00:30,330
Het heeft drie rijen één twee en drie en elke rij heeft drie Tweedy's.

9
00:00:30,360 --> 00:00:32,270
Dus komen we uit op een drie bij drie bestuursleden.

10
00:00:32,430 --> 00:00:42,890
En wat we zullen doen is in en op deze drie tv's gaan we links en rechts grens aan en vervolgens op deze drie gaan we naar de bovenste en onderste rand draaien.

11
00:00:43,560 --> 00:00:48,020
Dus moeten we beginnen met onze tafel en vervolgens drie lagen.

12
00:00:48,810 --> 00:00:53,490
En ik ben eigenlijk van plan om te gaan en te doen drie tiara's en doe het t D's eerste.

13
00:00:53,520 --> 00:01:01,450
Zo krijgen we drie tv en dan gewoon gaan dat eens te meer dupliceren.

14
00:01:01,590 --> 00:01:06,650
Nu hebben we onze drie rijen met drie elementen drie tv's in elk.

15
00:01:06,720 --> 00:01:12,940
Dus dat bewaren we en als we dit openen in de browser zul je merken dat we niet een ding zien.

16
00:01:13,500 --> 00:01:18,860
En dat komt omdat hoewel onze tafel is er er in de eerste plaats is er niets in onze tafel.

17
00:01:18,900 --> 00:01:25,910
En dan ook nog hebben we niet alle stijlen toegepast, omdat het mogelijk is om een ​​lege tafel te hebben en nog steeds zien de dingen die eigenlijk wat dit is hier.

18
00:01:25,910 --> 00:01:27,950
Er zijn geen gegevens in deze tabellen.

19
00:01:28,080 --> 00:01:32,700
In dit voorbeeld hier is het gewoon een tafel en dan is het vormgegeven.

20
00:01:32,700 --> 00:01:34,790
Zodat een daarmee een rand.

21
00:01:34,980 --> 00:01:36,320
Dus moeten we dat doen.

22
00:01:36,360 --> 00:01:45,210
Dus gewoon om u te bewijzen echter dat het hier laten we toe wat stijl en ik ga om het te doen in een stijl tag deze tijd, die u moet weten nu.

23
00:01:45,360 --> 00:01:59,370
Het is niet een geweldig idee op de lange termijn, maar alleen voor een oplossing video alleen voor het gemak van het kijken naar hier, zodat ze niet hoeven te kijken me schakelen tussen bestanden en in de war raken over wat gaat waar ik ga gewoon om te doen in één bestand hier aan de top in de stijl tag.

24
00:01:59,880 --> 00:02:22,920
Dus het eerste wat ik ga doen is selecteert u de T's en geef ze een breedte en dat komt omdat op dit moment als we inspecteerde de TT's zou je zien dat ze in principe is er helemaal niet.

25
00:02:22,930 --> 00:02:24,830
Ze zijn twee pixels twee pixels.

26
00:02:24,960 --> 00:02:30,680
Dus ze zijn echt heel klein en dat is omdat er niets is er en we hebben niet aan hen toegewezen een met of een hoogte.

27
00:02:30,690 --> 00:02:43,130
Dus wat ik wil doen is hen een breedte en we gaan beginnen met 100 pixels en dan gaan we hetzelfde doen voor de hoogte en we slaan en te vernieuwen en we nog steeds niet zie niets.

28
00:02:43,500 --> 00:02:46,860
En nogmaals dat is omdat we ze niet iets om te laten zien hebben gegeven.

29
00:02:47,010 --> 00:02:55,380
Maar als we gaan inspecteren nu kunnen we zien elkaar Tedy is nu een vierkant een 100 bij 100 pixels.

30
00:02:55,380 --> 00:02:59,160
Dus laten we gaan en geef ze een achtergrond gewoon zo je kunt zien dat ze er zijn.

31
00:02:59,310 --> 00:03:02,330
Zeg achtergrondinformatie roze redden.

32
00:03:03,000 --> 00:03:05,970
En nu kunnen we zien wij het begin van onze raad van bestuur.

33
00:03:06,120 --> 00:03:08,360
Dus ik ben eigenlijk van plan om ongedaan te maken dat de achtergrondkleur.

34
00:03:08,370 --> 00:03:11,400
Ik wilde alleen maar om te laten zien dat de tegels zijn er.

35
00:03:11,400 --> 00:03:12,630
We hebben onze tv's.

36
00:03:12,930 --> 00:03:18,750
En nu, wat we moeten doen is erachter te komen hoe het selectief inschakelen van de grens.

37
00:03:18,930 --> 00:03:22,800
Dus we gaan beginnen met deze drie elementen.

38
00:03:22,800 --> 00:03:25,380
We willen schakelen links en rechts grens.

39
00:03:25,380 --> 00:03:26,990
Dus als ik vernieuw de pagina.

40
00:03:27,140 --> 00:03:36,310
Maar laten we beginnen door het nemen van deze top een hier en het geven van een linker en een rechter kwartaal.

41
00:03:36,480 --> 00:03:40,990
Dus ik ga om te gaan en dat is de tweede TD plaats van de eerste TR.

42
00:03:41,070 --> 00:03:52,120
Ik ga gewoon om het een les te geven en ik ga gewoon om dit een verticale bellen en ik ga een klasse voor deze drie zogenaamde verticale, waar we gewoon de linker en rechter grenzen te krijgen te maken.

43
00:03:52,320 --> 00:03:53,820
Dus class is gelijk aan verticaal.

44
00:03:53,820 --> 00:04:11,570
En dan hier gaan we verticale selecteren en geef het een grens naar links en laten we één pixel zwart voor nu en doe hetzelfde voor de rand.

45
00:04:11,570 --> 00:04:12,530
Rechts.

46
00:04:12,780 --> 00:04:18,280
En als we besparen en we zijn fris je ziet hebben we de eerste vierkant voltooid.

47
00:04:18,690 --> 00:04:23,520
Dus nu moeten we de td die eronder en de TV dat is onder dat toe te voegen.

48
00:04:23,790 --> 00:04:29,020
En dat is waarom ik maakte het een klasse, want we gaan het meer dan één keer te gebruiken.

49
00:04:29,220 --> 00:04:45,730
Dus in plaats van het maken van deze een ID en dan doet een ander ID voor dit element en een ander ID voor deze ene, die ik helemaal had kunnen doen kon ik zoiets ID midden hebben gedaan en dan is dit een tot id midden bodem of zoiets.

50
00:04:46,530 --> 00:04:49,570
Nou ik kan een ruimte is er, maar zoiets hebben.

51
00:04:49,680 --> 00:04:51,760
Dat is eigenlijk niet een geweldig idee.

52
00:04:51,780 --> 00:04:57,410
We willen niet meerdere ID dus Im gewoon gaan om het een klasse te geven en dan is onze klasse is verticaal te hebben.

53
00:04:57,660 --> 00:05:01,350
Dus ik ga het ook geven aan deze.

54
00:05:01,560 --> 00:05:04,280
Dit is onze middelste element dat is direct onder het.

55
00:05:04,440 --> 00:05:07,440
En dan de andere die daaronder.

56
00:05:07,440 --> 00:05:13,000
Dus die drie hebben nu klasse verticale en je kunt zien we onze drie verticale lijnen.

57
00:05:13,650 --> 00:05:17,770
Dus hebben we nu moeten we gewoon hetzelfde proces op de horizontale lijnen te herhalen.

58
00:05:18,570 --> 00:05:20,740
En dus willen we dit element hier.

59
00:05:20,850 --> 00:05:26,250
Deze hier en deze hier om een ​​grens top en een rand bodem te hebben.

60
00:05:26,670 --> 00:05:45,270
Dus deze keer ga ik om te beginnen met de klas en krijgen we een horizontale en underspin een kopie deze behalve verandering grens links naar boven en de grens onderrand en dan alles wat we moeten doen is aanmelden deze horizontale klas met de juiste elementen.

61
00:05:45,270 --> 00:05:52,260
Zodat degenen die we willen dat dit op zijn dit hier dus dit gaat om de eerste te zijn T.T.

62
00:05:52,260 --> 00:05:54,500
in de tweede TR.

63
00:05:54,870 --> 00:05:56,100
Dus ik ga gewoon verder te gaan en dat te doen.

64
00:05:56,100 --> 00:06:01,420
Klasse gelijk is aan of is op de TL en kopieer die.

65
00:06:01,440 --> 00:06:09,910
Dan willen we het op deze middelste hier en je zult zien hebben we al een klasse verticale en we hebben niet eigenlijk dit eerder gezien, waar we meer dan één klasse.

66
00:06:09,930 --> 00:06:10,910
Het is heel eenvoudig.

67
00:06:10,920 --> 00:06:13,880
Alles wat we doen is het toevoegen van een ruimte.

68
00:06:13,890 --> 00:06:16,350
Dus dit is niet een klasse met de naam verticaal horizontaal.

69
00:06:16,350 --> 00:06:19,780
Het is twee verticale alsook horizontale.

70
00:06:20,190 --> 00:06:31,840
En dan zullen we hetzelfde doen om deze laatste CD die hij hier zou zijn en als we besparen en we ververs de pagina hebben we nu onze afgerond Tic Tac Toe boord.

71
00:06:31,950 --> 00:06:38,800
Dus het laatste wat ik hier wil doen is gewoon te bewegen dit over, zodat het wordt gecentreerd en het is eigenlijk heel eenvoudig.

72
00:06:38,910 --> 00:06:42,460
Het is gewoon een regel van het succes op onze tafel.

73
00:06:42,720 --> 00:06:47,820
We gaan er een marge van bestelling en daar gaan we.

74
00:06:47,850 --> 00:06:49,820
Die marge wordt automatisch berekend.

75
00:06:49,830 --> 00:06:51,270
Je kunt zien zoals ik bladeren.

76
00:06:51,330 --> 00:07:08,520
Ik bedoel, als ik het venster dat de marges verhogen en verlagen en vervolgens een laatste ding als we wilden toevoegen dat ieder in aan de top die net zegt Tic Tac Toe kan dat doen wijzigen.

77
00:07:08,550 --> 00:07:12,690
Maar je zult merken dat dit element Phi geïnspecteerd.

78
00:07:13,200 --> 00:07:16,480
Nou, je kunt zien zonder zelfs de inspectie is dat het allemaal de weg over aan de zijkant.

79
00:07:16,650 --> 00:07:22,900
Dus als ik wilde gaan in het midden van het element neemt daadwerkelijk de hele weg over het scherm.

80
00:07:23,150 --> 00:07:24,620
U kunt deze blauwe hier te zien.

81
00:07:24,870 --> 00:07:31,980
Dus ik kan gewoon Center de tekst en dat zal ons tot gevolg dat de H-1 is eigenlijk in het midden te geven.

82
00:07:31,980 --> 00:07:40,720
Dus ik gewoon H-1 tekst align center en ik spaar.