Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Projeto] Acabei de finalizar o curso: HTML e CSS: cabeçalho, footer e variáveis CSS

Olá, pessoal!!! Durante o curso estive estilizando uma página-web com os professores. Utilizamos um projeto da Joana Santos, postado no Figma. Eu procurei estilizar a page com um outro conteúdo, que no caso é o evento musical chamado: THE TOWN! E gostaria de compartilhar com vocês o resultado! =]

Deixarei parte do código no fim do tópico! PS: apesar de ter criado uma var para fonte principal, eu escolhi utilizar outras fontes em partes do código!

HOME DO PROJETO!

Ao clicar em INGRESSOS, somos redirecionados para essa page.

Ao clicar em "ISSO É THE TOWN" somo redirecionados para essa page, onde há informações sobre o evento e seus participantes.

INDEX.HTML↓↓↓

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Portifolio</title>
    <link rel="stylesheet" href="./styles/style.css">
</head>
<body>
    <header class="CABECALHO">
       
        <nav class="cabecalho__menu">
            
            <a class="cabecalho__menu_link" href="index.html">  HOME</a>
            <a class="cabecalho__menu_link" href="https://thetown.com.br/pt/ingressos/"> INGRESSOS </a>
            <a class="cabecalho__menu_link" href="about.html"> ISSO É THE TOWN! </a>
        </nav>
    </header>
    <main class="apresentacao">  
        <section class="aprensentacao__conteudo">
            <h1 class="apresentacao__titulo">
                Prepare-se para um dos maiores eventos de Rock de todos os tempos!
                <strong class="titulo-destaque"> Com as melhores bandas da atualidade!
                </strong></h1>
                <p class="aprensentacao__text"> Olá! Sou <strong class="titulo-destaque"> Gabriel Ramos </strong>, e eu serei o seu guia para aproveitar 
                um dos maiores eventos de Rock da atualidade, chamado:  <strong class="meudestaque" > 
                    <a class="meudestaque" href="https://thetown.com.br/">
                    THE TOWN!
                 </a>
                

                </strong> Neste site irei mostrar a vocês tudo que vai ocorrer em todos os dias desse grande evento. <h3 class="letsrock
                "> Let's
                ROCK?</h3></p>
                
                <div class="apresentacao__links">
                    <h2 class="apresentcao_subtitulo">ACESSE MINHAS REDES</h2>
                    <a  class="apresentacao__links__link" href="https://www.instagram.com/_gaberamoss_/">
                        Instagram
                        <img src="AULA/Assets-aula2-curso3-html-e-css-main/assets/instagramlink.png">
                    </a>
                    <a class="apresentacao__links__link" href="https://www.linkedin.com/in/gabriel-ramos-2ba4861b2/">
                         LinkedIn
                          <img src="AULA/Assets-aula2-curso3-html-e-css-main/assets/linkedinlink.png">
                        </a>
                     
                    <a  class="apresentacao__links__link" href="https://github.com/guilhermeonrails?tab=packages">
                        GitHub
                        <img src="AULA/Assets-aula2-curso3-html-e-css-main/assets/githublink.png">
                         
                        
                    
                    </a>
                
                 
            </div>
        </section>
            <img src="AULA/Assets-aula2-curso3-html-e-css-main/assets/ROCK2.png" alt="Foto da Joana Santos programando">
    </main>
    <footer class="rodape_">
        <p>  Desenvolvido por Gabriel Ramos
        </p>
        
    </footer>
</body>
</html>
1 resposta
solução!

Oii, Gabriel! Tudo bem?

Parabéns por colocar em prática o desafio proposto pela atividade e indo além, estilizando a página do jeito que desejou!

Continue se dedicando aos estudos e qualquer dúvida, conte conosco para te ajudar.

Bons estudos, Gabriel!