1
00:00:00,600 --> 00:00:06,790
Quindi la prossima cosa che vogliamo fare è aggiungere il testo in alto, quindi è necessario che assomigli a questo.

2
00:00:06,960 --> 00:00:11,020
E fortunatamente questo è relativamente semplice rispetto alla creazione di questa griglia di immagini.

3
00:00:11,370 --> 00:00:13,550
Quindi la prima cosa che dobbiamo fare è ottenere il font.

4
00:00:13,770 --> 00:00:15,360
Questo font si chiama Railway.

5
00:00:15,360 --> 00:00:18,130
È uno dei font di Google che abbiamo visto finora.

6
00:00:18,390 --> 00:00:22,950
Quindi ho intenzione di andare su Google Fonts e cercare reale.

7
00:00:22,980 --> 00:00:23,590
Eccoci qui.

8
00:00:23,620 --> 00:00:32,430
È il top che uso qui e poi ho intenzione di andare avanti e prendere il normale.

9
00:00:32,520 --> 00:00:37,090
E facciamo anche 800.

10
00:00:38,220 --> 00:00:40,410
E poi includeremo questo

11
00:00:44,370 --> 00:00:46,170
nel nostro HMO.

12
00:00:46,560 --> 00:00:52,710
Quindi ora abbiamo accesso a quel font e quindi tutto ciò che dobbiamo fare è aggiungere il testo.

13
00:00:52,710 --> 00:00:59,760
Prima di tutto, quindi, ne farò un paragrafo e metterò il mio nome che è quello che avevo

14
00:00:59,760 --> 00:01:01,820
qui separato da una barra.

15
00:01:02,160 --> 00:01:04,390
Possiamo dirti di mettere tutto ciò che vuoi qui.

16
00:01:04,410 --> 00:01:10,650
ma solo un testo lo sto mantenendo semplice e poi lo salvo e poi andremo qui.

17
00:01:10,650 --> 00:01:17,100
Questo potrebbe essere il Texas potrebbe essere il blog di fotografia o entrare nel mio blog

18
00:01:17,410 --> 00:01:26,760
Seleziona il paragrafo e diremo semplicemente la famiglia dei font in modo reale e vediamo solo cosa finiamo.

19
00:01:27,470 --> 00:01:27,950
OK.

20
00:01:28,260 --> 00:01:30,490
Quindi non il più eccitante.

21
00:01:30,630 --> 00:01:31,960
Non ancora del tutto lì.

22
00:01:31,980 --> 00:01:36,160
È troppo piccolo e non è posizionato correttamente.

23
00:01:36,210 --> 00:01:38,900
Ne abbiamo bisogno per andare oltre 1. 6 percento pure.

24
00:01:39,000 --> 00:01:43,030
Proprio come questa immagine, per spostarla in linea possiamo iniziare da lì.

25
00:01:43,260 --> 00:01:52,620
Tutto quello che dobbiamo fare è passare a un paragrafo e aggiungere il margine a sinistra e questo è solo

26
00:01:52,650 --> 00:01:55,190
un punto sei sei percento.

27
00:01:55,520 --> 00:01:59,750
Siamo freschi OK ora distanziati correttamente.

28
00:01:59,880 --> 00:02:03,340
Quindi un'altra cosa che vogliamo fare è sicuramente aumentare la dimensione del carattere.

29
00:02:03,780 --> 00:02:10,020
Quindi so che la dimensione del font che ho usato qui è di 23 pixel e non solo, ma ho usato il

30
00:02:10,020 --> 00:02:12,980
peso del font di 800, motivo per cui ho dovuto selezionarlo.

31
00:02:12,990 --> 00:02:17,240
Quindi qui dirà la dimensione del carattere di 23 pixel.

32
00:02:17,460 --> 00:02:20,030
Ti mostrerò come si presenta.

33
00:02:20,190 --> 00:02:23,500
Quindi è più grande ma non è ancora così audace.

34
00:02:23,520 --> 00:02:27,660
Quindi torniamo indietro e aggiungiamo il peso del font.

35
00:02:28,080 --> 00:02:30,750
Ottocento e salve.

36
00:02:31,260 --> 00:02:33,610
Ora eravamo freschi in autunno.

37
00:02:33,610 --> 00:02:39,810
Sta guardando vicino ma ci manca ancora una cosa che è il fatto che

38
00:02:39,810 --> 00:02:47,800
non ho usato il testo maiuscolo così posso farlo usando la trasformazione del testo o potrei alterare l'HDMI.

39
00:02:48,230 --> 00:02:52,470
Quindi ho intenzione di farlo che qui il testo si trasforma in maiuscolo.

40
00:02:52,590 --> 00:02:54,880
Ora prendiamo tutto in maiuscolo.

41
00:02:54,970 --> 00:02:55,960
Eccoci.

42
00:02:56,370 --> 00:03:02,790
Quindi puoi vedere solo con un rapido esempio perché potresti usare la trasformazione del testo perché è molto

43
00:03:02,790 --> 00:03:08,400
più semplice e veloce aggiungerne uno per valutare la proprietà piuttosto che dover ridigitare ogni

44
00:03:08,400 --> 00:03:12,380
singola lettera, soprattutto se hai una stringa di caratteri più lunga.

45
00:03:12,990 --> 00:03:16,690
OK, quindi ora l'ultimo pezzo mancante è questa piccola linea qui.

46
00:03:16,820 --> 00:03:22,980
So che è piuttosto debole ma c'è una linea qui e va in linea con questa prima immagine in modo

47
00:03:22,980 --> 00:03:24,940
che non vada fino in fondo.

48
00:03:25,230 --> 00:03:28,160
Va il 30 percento del percorso.

49
00:03:28,170 --> 00:03:34,390
Quindi il modo in cui lo faremo è in realtà solo un bordo nella parte inferiore di esso è

50
00:03:34,770 --> 00:03:36,560
ispezionato in fondo a questo paragrafo.

51
00:03:36,960 --> 00:03:43,500
Quindi puoi vedere che il paragrafo stesso va al 30 percento e il modo in cui finisce finisce qui e

52
00:03:43,500 --> 00:03:46,000
poi tocca solo il fondo che abbiamo attivato.

53
00:03:46,500 --> 00:03:51,360
Quindi torniamo alla nostra C SS e al nostro paragrafo.

54
00:03:51,480 --> 00:03:58,380
Iniziamo dandogli il bordo inferiore e rendiamolo ovvio per iniziare, quindi facciamo come tre pixel

55
00:03:58,830 --> 00:03:59,830
rosso fisso.

56
00:03:59,880 --> 00:04:06,370
Quindi salveremo e aggiorneremo e vedremo che il confine attraversa tutto.

57
00:04:06,490 --> 00:04:08,420
E immagino che non sembri troppo male.

58
00:04:08,430 --> 00:04:10,460
Vogliamo assolutamente risolvere questo problema qui.

59
00:04:10,800 --> 00:04:16,260
Ma piuttosto che farlo modificherò la larghezza in modo che passi solo il 30 percento del percorso.

60
00:04:16,830 --> 00:04:18,170
Quindi inizieremo con quello.

61
00:04:18,390 --> 00:04:24,220
Quindi è solo questione di impostare la larghezza al paragrafo 30 per cento.

62
00:04:25,250 --> 00:04:32,730
OK, quindi ora finisce lì, quindi la prossima cosa è far corrispondere il colore in modo che il colore che uso

63
00:04:32,730 --> 00:04:33,810
sia molto debole.

64
00:04:34,080 --> 00:04:36,090
Sto solo per cambiare questo qui.

65
00:04:36,150 --> 00:04:38,950
È un colore esadecimale.

66
00:04:39,000 --> 00:04:44,780
EF 1 EF 1 EF 1 sembra così.

67
00:04:45,630 --> 00:04:51,140
Puoi vedere che è molto debole e penso di averlo a due pixel anziché tre.

68
00:04:51,450 --> 00:04:53,030
Quindi un cambiamento molto minore.

69
00:04:53,070 --> 00:04:59,520
Cambia quello per essere due pixel e l'ultima cosa è la spaziatura.

70
00:04:59,520 --> 00:05:04,540
Quindi qui puoi vedere che abbiamo un po 'di spazio tra il testo e il bordo.

71
00:05:04,590 --> 00:05:12,200
E qui non ricordiamo tanto lo spazio tra un elemento e il suo bordo è il riempimento.

72
00:05:12,450 --> 00:05:18,720
Quindi, se ispezioniamo, puoi verificare che posso vedere quel riempimento verde lì.

73
00:05:19,320 --> 00:05:22,190
Quindi abbiamo solo bisogno di ottenere imbottiture andando anche qui.

74
00:05:22,200 --> 00:05:25,470
Quindi in RC SS faremo solo

75
00:05:28,370 --> 00:05:33,500
il riempimento di 20 pixel in basso e torneremo all'aggiornamento.

76
00:05:33,570 --> 00:05:35,740
E ora abbiamo un po 'di spazio lì.

77
00:05:35,760 --> 00:05:40,350
Ora, naturalmente, sentiti libero di giocare con questo, a tuo piacimento, se preferisci che

78
00:05:40,350 --> 00:05:42,360
quella linea vada avanti o no.

79
00:05:42,400 --> 00:05:47,610
Vuoi rendere il testo più grande se vuoi farlo liberare il padding o aggiungere più padding

80
00:05:47,910 --> 00:05:51,350
se vuoi che più immagini vadano sullo schermo anziché solo tre.

81
00:05:51,360 --> 00:05:53,430
C'è un sacco di cose che puoi fare.

82
00:05:53,430 --> 00:05:56,770
Va bene, quindi spero che ti sia divertito a fare qualcosa che sembra un po 'OK.