Bem-vindo de volta.
Vamos continuar construindo a página inicial.
E, como você pode ver, voltei para a
imagem de fundo tradicional.
Mas, como eu disse, se você quiser
usar o vídeo, tudo bem.
A próxima seção que vamos construir será a
seção de duas colunas que terá
alguns textos à esquerda, uma imagem à direita.
E então a terceira seção aqui é muito, muito semelhante.
São apenas as colunas invertidas.
Na terceira seção, temos a imagem à esquerda
e depois o texto à direita.
Então, como exatamente vamos conseguir isso?
Isso é muito, muito, muito direto.
Vamos para uma página inicial.
Vamos editar.
E você pode ver agora que são
basicamente duas colunas, 5050.
Então, muito facilmente, vamos descer aqui,
criar uma nova seção com duas colunas, 5050.
Vou editar a seção,
certificar-me de que ela fique toda a largura.
E então as colunas GAAP dirão que não há lacuna.
Tudo bem, então a primeira seção aqui,
vai ter alguns textos.
Deixe-me desenhar o editor de texto aqui.
Lambda copie o texto fictício de Lorem Ipsum
que tenho aqui.
Deixe-me ir em frente e colar isso.
E então também temos o cabeçalho.
Deixe-me largar isso por desafio. É um h2.
Aqui.
Na verdade, não criei
nenhum cabeçalho real, nenhum título real.
Então deixe-me digitar.
Adoraríamos viajar.
Apenas alguma coisa. É isso.
E então, para a segunda coluna aqui,
vamos adicionar a imagem,
e vou adicionar essa imagem que tirei em Istambul.
Este foi um grupo de nossos estudantes universitários.
Eu estava andando por aí e disse: Ei,
você gostaria que eu tirasse uma foto dessa ideia?
Então eu tirei a foto.
Portanto, certifique-se de definir essa imagem para enganar.
Porque, novamente, queremos que a imagem ocupe
toda a largura e a altura de sua coluna.
Mas também precisamos adicionar o botão Saiba mais.
Então o que vou fazer, é claro,
é voltar aqui,
arrastar o botão, soltá-lo aqui.
E então vou dizer aprenda, saiba mais.
Então este link pode ir para talvez a página sobre.
Então, vou simplesmente dizer barra para frente.
E lá está ele.
Vou me alinhar com o centro.
Vamos fazer algumas alterações.
Tipografia de estilo.
Vou dizer transformar-se em maiúsculas.
A declaração sobre não dentro do que uma integração.
E, em seguida, a cor do texto.
Vou mudar isso para preto.
Agora, o botão real em si vai com
uma cor de fundo de branco.
digitação de fundo aqui será de cor branca.
Mas então vamos definir uma borda de
sólido para que possamos realmente ver o botão.
E se você quisesse, você poderia
adicionar alguns vídeos de borda também.
Mas não vou fazer isso.
Uma última coisa a fazer seria
alinhar nosso conteúdo no meio.
Então, vou clicar no botão Editar Coluna, comentários,
Alinhar Vertical, define o meio.
E então mais uma coisa que fazemos
para ter algum espaço à esquerda
e à direita é contra agora, o texto não está
exatamente à direita da borda da coluna,
então precisamos adicionar algum espaçamento.
Então, vou voltar aqui.
O que vamos fazer é muito, muito simplesmente,
vamos avançar
para a mesma coluna. Bem aqui.
Vamos desvincular os valores para o padrão.
E então vou dar 50 pixels
por 50 pixels à esquerda.
E lá está ele.
Construímos nossa segunda seção com muita facilidade,
já que a terceira seção é muito, muito
semelhante em design,
o que podemos fazer é simplesmente clicar com o botão direito do mouse na
proteína da seção de edição e depois duplicar.
E agora o que vou simplesmente fazer
é arrastar esta primeira coluna aqui,
arrastá-la até aqui, trocar as colunas.
E agora de forma muito simples,
vamos em frente e edite essa imagem.
Vou escolher este que eu peguei na Argentina.
suporte se encaixa em L, cor gordurosa.
E então, é claro, para os textos aqui,
eu adicionei qualquer coisa viajada para
os melhores lugares como o cabeçalho, ok,
então deixe-me trocar esse cabeçalho aqui e
dizer viajar para os melhores lugares.
Lá vai você. Tudo bem, vamos em frente agora atualizações.
Digamos como a página se parece.
Vamos, vamos.
Tenha paciência comigo. Infelizmente, esses são
os riscos ocupacionais de um instrutor, um professor.
Às vezes, o incidente começa
a bagunçar e , finalmente, ele é atualizado.
Certo, obrigado. Agora, vamos ver a página.
Vamos rolar para baixo e lá está.
Certo, mais uma coisa.
Assim como um bônus,
poderíamos adicionar alguma animação
para que as imagens talvez gostem,
você sabe, este slide da esquerda e da direita.
Então, o que podemos fazer é simplesmente voltar
e verificar essa alegoria para a primeira imagem,
aquela com os alunos aqui,
vou editar a imagem.
Vá para o isqueiro avançado,
você tem efeitos de movimento.
Vou dizer animação de entrada.
Vamos deslizar das luzes.
Ok, tão ligeiramente da direita,
então cortando da direita.
E então para esta imagem era simplesmente fazer
o slide oposto da esquerda.
Efeitos de movimento.
Diminuiu, informa ou amou.
Certo, isso foi meio estranho.
Não sei exatamente o que eles fizeram.
Deixe-me fazer isso de novo.
Certo.
Por algum motivo, a janela da imagem
para a segunda coluna.
Não sei por que isso aconteceu,
mas tudo bem, vou apenas ir em frente e atualizar.
Lá vamos nós.
Vamos ver a página. Vamos rolar para baixo.
Faz deslizar da esquerda,
enganado e deleite, e lá está.
E assim, nossa página inicial
está começando a entrar em vigor.
Então, junte-se a mim no próximo vídeo, onde agora vamos
dar uma olhada em como vamos construir a
próxima seção,
que seria o design de viagem exclusivo.