Então, a próxima coisa que queremos fazer é adicionar o texto no topo, então precisa ser assim.
E, felizmente, isso é relativamente simples em comparação com a criação dessa grade de imagem.
Então, a primeira coisa que precisamos fazer é obter a fonte.
Esta fonte é chamada de Ferroviária.
É uma das fontes do Google que já vimos até agora.
Então eu vou para as fontes do Google e procurar por real.
Aqui vamos nós.
É o top aqui para uso e então eu vou seguir em frente e pegar normal.
E também vamos fazer 800.
E então vamos incluir
isso em nosso HMO.
Então, agora temos acesso a essa fonte e então tudo o que precisamos fazer é adicionar no texto.
Primeiro de tudo, por aqui, vou fazer um parágrafo e vou colocar o meu nome, o que eu
aqui separei por uma barra.
Nós podemos fazer você saber colocar o que quiser aqui.
alguns textos, eu estou mantendo isso simples e, em seguida, salve isso e então vamos passar aqui.
Isso poderia ser o Texas poderia ser um blog de fotografia ou entrar no meu blog, mas apenas
Selecione o parágrafo e nós simplesmente diremos a família de fontes de maneira real e vamos ver o que acabamos.
ESTÁ BEM.
Então, não é o mais emocionante.
Ainda não está lá.
É muito pequeno e não está espaçado corretamente.
Precisamos movê-lo sobre 1. 6 por cento também.
Assim como esta imagem para movê-la na linha, podemos começar por aí.
Tudo o que precisamos fazer é passar para um parágrafo e adicionar a nossa margem esquerda e isso é apenas
um ponto seis seis por cento.
Estamos frescos OK agora espaçados corretamente.
Então, mais uma coisa que queremos fazer é definitivamente aumentar o tamanho da fonte.
Então eu sei que o tamanho da fonte que eu usei aqui é de 23 pixels e não só isso, mas eu usei o peso da
fonte de 800, e é por isso que eu precisava selecionar isso.
Então, aqui, dirá tamanho de fonte 23 pixels.
Eu vou mostrar o que isso parece.
Então, é maior, mas ainda não é tão ousado.
Então, voltamos e adicionamos o peso da fonte.
Oito cem e economize.
Agora estávamos frescos no outono.
Está parecendo perto, mas ainda estamos faltando uma coisa que é o fato de eu não
usar texto em maiúscula, então eu posso fazer isso usando a transformação de texto ou eu poderia alterar o HDMI.
Então, vou fazer isso aqui, o texto transforma as maiúsculas.
Agora recebemos todas as maiúsculas.
Aqui vamos nós.
Então, você pode ver apenas com um exemplo rápido por que você usaria potencialmente a transformação de texto porque é
muito mais rápido e fácil apenas adicionar uma para avaliar a propriedade ao invés de ter que digitar
novamente cada letra, especialmente se você possui uma série mais longa de caracteres.
Ok, então agora a última peça faltante é essa pequena linha aqui.
Eu sei que é muito fraco, mas há uma linha aqui e vai em linha com esta primeira imagem para
que ele não vá todo o caminho.
Vai 30% do caminho.
Então, a maneira como vamos fazer isso é que na verdade é apenas uma borda na parte inferior, é
inspecionada no final deste parágrafo.
Então, você pode ver que o parágrafo em si vai 30 por cento, o caminho através dele termina aqui e, em
seguida, é apenas o limite inferior que ativamos.
Então, voltemos ao nosso C SS e ao nosso parágrafo.
Vamos começar dando-lhe o fundo da borda e vamos deixar que seja óbvio começar, então vamos fazer como três pixels
de vermelho sólido.
Então, vamos economizar e atualizar e apenas ver que a fronteira vai todo o caminho.
E acho que não parece muito ruim.
Definitivamente queremos corrigir isso aqui.
Mas ao invés de fazer isso, vou mudar a largura, de modo que ele só vá 30 por cento do caminho.
Então, vamos começar com isso.
Então, é apenas uma questão de ajustar a largura para o parágrafo 30 por cento.
OK, então agora termina lá, então a próxima coisa é fazer a correspondência de cores, então a cor que eu uso
é muito fraca.
Vou mudar isso aqui.
É uma cor hexadecimal.
EF 1 EF 1 EF 1 parece assim.
Você pode ver que é muito fraco e acho que tinha dois pixels em vez de três.
Então mudança muito pequena.
Mude que seja dois pixels e a última coisa é o espaçamento.
Então, aqui, você pode ver que temos algum espaço entre o texto e a borda.
E aqui não lembramos assim espaço entre um elemento e sua borda é preenchimento.
Então, se inspecionarmos, você pode verificar se eu posso ver esse preenchimento verde lá.
Então, nós só precisamos ter o preenchimento indo aqui também.
Então, no RC SS, vamos fazer o
preenchimento no fundo de 20 pixels e voltaremos a atualizar.
E agora temos um pouco de espaço lá.
Agora, claro, sinta-se livre para jogar com isso, como quiser, se você preferisse que a
linha fosse completamente ou sem linha.
Você quer aumentar o tamanho do texto se desejar que ele se livrar do preenchimento ou adicionar mais
preenchimento se quiser mais imagens na tela em vez de apenas três.
Há todo o tipo de coisas que você pode fazer.
Tudo bem, então espero que você tenha gostado de fazer algo que parece um pouco aceitável.