1
00:00:02,070 --> 00:00:05,370
Quindi passiamo a una soluzione per questo esercizio.

2
00:00:05,640 --> 00:00:09,210
Come sempre puoi dare un'occhiata al codice subito se vuoi seguirlo.

3
00:00:09,210 --> 00:00:10,430
Inizia da zero con me.

4
00:00:10,440 --> 00:00:12,110
Sentiti libero di farlo.

5
00:00:12,150 --> 00:00:18,640
Quindi la primissima cosa che dobbiamo fare è creare un nuovo file che chiamerò Pokemon che ogni squadra

6
00:00:21,450 --> 00:00:25,870
creerà la nostra etichetta e riempiremo il titolo per abbinare dove dovrebbe essere.

7
00:00:26,070 --> 00:00:28,070
Oh, vieni sul grafico.

8
00:00:29,760 --> 00:00:39,750
Quindi sappiamo che questo avrà un H-1 in cima e che ognuno di essi è solo il primo genocidio sul grafico.

9
00:00:40,740 --> 00:00:48,690
E sappiamo che ci sarà un tavolo in quel tavolo e una testa T e un corpo che solo per rinfrescare la tua memoria non hanno

10
00:00:48,690 --> 00:00:52,610
alcun impatto sul modo in cui la tabella si presenta o si comporta.

11
00:00:52,770 --> 00:01:00,210
Si tratta semplicemente di rendere il nostro markup il più semantico possibile, facendo in modo che un motore di ricerca o

12
00:01:00,360 --> 00:01:06,580
un webcrawler sappiano che questo è il vero e proprio del cappellaio e questo è il corpo.

13
00:01:06,720 --> 00:01:09,450
Quindi, solo una buona idea è pratica.

14
00:01:09,450 --> 00:01:23,670
Quindi andremo ad aggiungere i nostri quattro titoli più importanti, quindi per gli adolescenti abbiamo il tipo di nome

15
00:01:23,670 --> 00:01:26,230
dell'immagine e ci evolviamo.

16
00:01:26,880 --> 00:01:31,190
Quindi andiamo avanti e vediamo come va tutto bene.

17
00:01:31,470 --> 00:01:33,900
C'è il nostro tavolo finora.

18
00:01:33,900 --> 00:01:40,480
La prima cosa che probabilmente vorremmo fare è solo quella di far coincidere ciò che avevamo, dargli un confine.

19
00:01:40,740 --> 00:01:46,020
Ricorda però che non vogliamo davvero farlo più tardi in classe, quindi una volta che

20
00:01:46,030 --> 00:01:50,050
parliamo di C S, faremo tutto lo styling attraverso C S S.

21
00:01:50,070 --> 00:01:53,730
Questo è solo per rendere le cose visive per ora.

22
00:01:53,970 --> 00:02:00,540
Non è una cattiva idea conoscerlo, ma è un'idea migliore davvero fare questo professionalmente.

23
00:02:00,570 --> 00:02:02,540
OK, allora prendiamo alcuni di questi dati.

24
00:02:02,720 --> 00:02:10,440
fondo qui e commenta tutto fuori e poi tutto quello che sta per fare è creare la mia prima riga, quindi inizierà con bulboasaur.

25
00:02:10,440 --> 00:02:12,440
Quando si copia giù fino in

26
00:02:12,480 --> 00:02:19,840
Quindi invece del corpo necessario per il tuo Invece di quel TR Abbiamo bisogno di 40.

27
00:02:21,480 --> 00:02:25,230
Il nome corrisponderà al nostro secondo Th.

28
00:02:25,340 --> 00:02:28,130
Quindi lo inserirò nella seconda t d.

29
00:02:28,410 --> 00:02:30,440
L'immagine va prima di tutto.

30
00:02:30,690 --> 00:02:36,720
Quindi ho intenzione di copiare l'immagine che hai e poi ho intenzione di creare un tag immagine e

31
00:02:36,780 --> 00:02:42,570
impostare la sorgente uguale a quello in cui sei reale all'interno di quel tiddy, se vuoi, potresti distanziarlo

32
00:02:42,570 --> 00:02:44,310
un po 'come questo .

33
00:02:44,430 --> 00:02:49,200
Quindi sai che questo non ha alcun impatto su qualcosa di puramente estetico

34
00:02:49,200 --> 00:02:56,670
nel nostro codice, in modo che possiamo vedere le relazioni che questa immagine è annidata all'interno della TV che se

35
00:02:56,670 --> 00:03:00,540
abbiamo il nome successivo abbiamo tipo che è erba e veleno.

36
00:03:00,540 --> 00:03:05,090
E infine abbiamo un altro più complesso in cui abbiamo un tag AI.

37
00:03:05,730 --> 00:03:12,390
Ricorda che deve assomigliare a questo un tag che dice che Ivey's o così che l'e-tag copi il

38
00:03:12,390 --> 00:03:21,540
link di cui ha bisogno per andare e poi copiamo il nome per quel contenuto e poi ho intenzione di andare avanti e sbarazzarmi di

39
00:03:21,930 --> 00:03:24,330
questo fino a sbarazzarsi dei commenti.

40
00:03:24,330 --> 00:03:28,570
Beh, sbarazzati di questo solo per pulire un po 'questo.

41
00:03:29,190 --> 00:03:32,330
Rinnova e c'è la nostra prima voce.

42
00:03:32,430 --> 00:03:33,690
Controlla che funzioni.

43
00:03:33,700 --> 00:03:35,150
O posso essere dolorante.

44
00:03:35,160 --> 00:03:36,180
Grande.

45
00:03:36,840 --> 00:03:37,560
OK.

46
00:03:37,560 --> 00:03:40,620
Quindi in pratica ripeteremo esattamente lo stesso processo.

47
00:03:40,620 --> 00:03:43,930
E per il momento ho intenzione di copiare questo.

48
00:03:44,100 --> 00:03:53,030
questa bella scorciatoia in cui puoi selezionare e premere il comando shift il comando shifty due volte se lo desideri.

49
00:03:53,040 --> 00:04:02,640
Quindi questa intera riga e ricorda che potevi fare Control-C e incollarlo con il controllo V e il comando C in

50
00:04:02,700 --> 00:04:04,250
comando forniamo anche

51
00:04:04,500 --> 00:04:07,910
E questo lo duplicherà due volte.

52
00:04:07,920 --> 00:04:12,540
Quindi ora lo abbiamo raddoppiato automaticamente e abbiamo solo bisogno di passare e apportare alcune modifiche.

53
00:04:13,200 --> 00:04:16,320
Quindi il primo nome

54
00:04:20,220 --> 00:04:21,380
è Car

55
00:04:26,850 --> 00:04:33,770
Mandar l'immagine che sei Gufo e abbiamo bisogno di Tamilian.

56
00:04:34,740 --> 00:04:38,400
di fuoco e tutti qui sono incollati.

57
00:04:43,980 --> 00:04:45,830
È un tipo

58
00:04:47,040 --> 00:04:48,360
Controlliamo su quello.

59
00:04:48,780 --> 00:04:54,480
Quindi dovremmo avere open source perché copia e incollato nel link è corretto.

60
00:04:54,480 --> 00:04:55,250
Grande.

61
00:04:55,290 --> 00:04:57,660
Ora dobbiamo solo finire con

62
00:05:03,300 --> 00:05:03,870
l'acqua

63
00:05:08,510 --> 00:05:09,960
di immagine Squirtle.

64
00:05:10,050 --> 00:05:12,210
la bevanda è acqua.

65
00:05:14,570 --> 00:05:21,560
Andiamo con te o prima se il link cambia nome o tartaruga e

66
00:05:21,760 --> 00:05:26,350
Tutta la quantità di copia e incolla lì.

67
00:05:26,380 --> 00:05:27,170
Eccoci.

68
00:05:27,180 --> 00:05:28,860
Assicurati che tutto funzioni alla grande.

69
00:05:29,030 --> 00:05:33,950
OK, questo è tutto ciò che dobbiamo fare per essere sicuri che corrispondano.

70
00:05:34,170 --> 00:05:37,810
Sembra buono.

71
00:05:38,280 --> 00:05:38,920
Grande.

72
00:05:38,940 --> 00:05:41,490
Un piccolo cambiamento che potrei fare mentre sono qui.

73
00:05:41,490 --> 00:05:43,250
Solo una buona lezione su questo.

74
00:05:43,250 --> 00:05:51,620
Aggiungerò un commento qui solo per chiarire per voi ragazzi, quindi questa prima è qual è stata la vostra prossima.

75
00:05:51,630 --> 00:05:54,500
Questo è tutto sul fascino mandar.

76
00:05:54,510 --> 00:06:01,460
E infine questo è tutto ciò che corrisponde a Squirtle.

77
00:06:01,530 --> 00:06:05,680
Un cambiamento però come ho detto è che queste immagini sono piuttosto massicce.

78
00:06:05,780 --> 00:06:09,880
Potremmo ridurli abilmente e ciò ridurrebbe le dimensioni di un tavolo.

79
00:06:10,110 --> 00:06:14,110
E questo è qualcosa che dovresti fare con CSSA è informazioni di stile.

80
00:06:14,190 --> 00:06:18,090
Quindi idealmente lo facciamo con s lontano da ogni squadra.

81
00:06:18,120 --> 00:06:19,900
Vogliamo tenerli separati.

82
00:06:19,950 --> 00:06:22,360
Ogni volta strutturerò lo stile CSSA.

83
00:06:22,710 --> 00:06:32,340
Ma per questo esercizio ciò che possiamo fare è aggiungere un attributo con un'immagine a un numero come

84
00:06:32,340 --> 00:06:35,220
50 e vederlo come aggiornamento.

85
00:06:35,220 --> 00:06:44,380
Questo cambia a 50 pixel molto più piccoli dove si passa a 500 e si ottiene un'immagine gigantesca.

86
00:06:44,540 --> 00:06:45,640
Tienilo a 50.

87
00:06:45,990 --> 00:06:53,700
E un'altra ragione per cui voglio mostrarvi questo è piuttosto che copiare e incollare questo

88
00:06:53,700 --> 00:06:56,450
tre volte che funziona bene.

89
00:06:56,910 --> 00:07:05,430
Un modo migliore per farlo in sublime è di creare effettivamente tre cursori, quindi ti mostrerò cosa intendo.

90
00:07:05,670 --> 00:07:14,290
Facciamo clic tenendo premuto il comando fai nuovamente clic sul comando di estrazione e clic di nuovo, quindi possiamo iniziare a digitare.

91
00:07:14,320 --> 00:07:20,100
E ho tre cursori contemporaneamente con uguale a 50.

92
00:07:20,370 --> 00:07:21,800
Quindi questo è abbastanza bello.

93
00:07:21,810 --> 00:07:27,000
È davvero utile se hai bisogno di cambiare più cose contemporaneamente nello stesso identico modo

94
00:07:27,000 --> 00:07:31,810
con cui fai clic su tutto il luogo e genera una serie di maledizioni.

95
00:07:32,490 --> 00:07:38,890
E come puoi vedere abbiamo un bel tavolo più leggibile e ragionevole.

96
00:07:38,900 --> 00:07:39,360
Tutto ok