Entrar Ainda não tem acesso?
1
resposta

Faça como eu fiz: Ajustando área de tópicos mais visitadas.

Referente ao curso Praticando CSS Flexbox, no capítulo Posicionando elementos com Flexbox e atividade Faça como eu fiz: ajustando área de tópicos mais visitadas

por Estanislau Antonio da Silva Junior
| 61k xp | 213 posts

Index. Html

<section class="topicos-visitados">
    <h2>Tópicos visitados recentemente</h2>
    <div class="topicos">
        <span>Android</span>
        <span>OO</span>
        <span>Marketing digital</span>
        <span>Agile</span>
        <span>Startups</span>
        <span>HTML e CSS</span>
        <span>Java</span>
        <span>Python</span>
    </div>
</section>

Style. Css

body{
    background: linear-gradient(180deg, rgba(0,47,82,1) 0%, rgba(50,101,137,1) 100%);
    background-repeat:no-repeat;
    font-family:"Poppins";
}

.topicos-visitados {
    padding:20px;
}

h2{
    font-size:24px;
    font-weight:300;
    color:#FFFFFF;
}

.topicos span{
    background-color:#EB9B00;
    padding:8px;
    color: #FFFFFF;
    text-align:center;
}

Tópicos mais Visitadas

1 resposta
por Lorena Garcia
| 9944.5k xp | 14953 posts
Alura Scuba Team Suporte Educacional

Oi, Estanislau! Como vai?

Obrigada por compartilhar seu código com a comunidade Alura.

Curti como você aplicou o gradiente de fundo e destacou os tópicos com a cor amarela — o contraste deixa a área visualmente atrativa e fácil de ler.

Continue firme nos estudos.

Ícone de sugestão Para saber mais:

Se quiser ler mais sobre as propriedades do CSS, indico os links abaixo:

Alura Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!