Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Onde devo setar a cor ?

Referente ao curso HTML5 e CSS3 I: Suas primeiras páginas da Web

por Daniel Pôrto Núñez
| 69.4k xp | 38 posts

Em relação ao seguinte trecho do html

<aside>
            <nav>
                <h1>JOÃO DA SILVA</h1>
                <ul>
                    <li><a href="index.html">Home</a></li>
                    <li><a href="portifolio.html">Portifólio</a></li>
                    <li><a href="bio.html">Sobre mim</a></li>
                    <li><a href="blog.html">Blog</a></li>
                    <li><a href="contato.html">Contato</a></li>
                </ul>
            </nav>
</aside>

No css, a opção que eu devo fazer meus ajustes de cor(background/fonte)/alinhamento/padding/tamanho(fonte)/entre outras caracteriticas. Fico confuso entre usar aside nav{} ou somente nav{} ou até mesmo.

Vou deixar aqui também o meu css completo em relação ao menu, se der para dar uma olhada, agradeço

nav{
    background-color: #851944;
    padding: 25px;
}
nav h1{
    font-size: 30px;
    text-align: center;
}

nav li{
    text-align: center;
}

nav a{
    font-family: "Open Sans Condensed", sans-serif;
    color: #F2FFFC;
    text-decoration: none;
}
2 respostas
solução!
por Luiz Fernando Maehana
| 610.1k xp | 403 posts
Desenvolvedor Front-end

Olá Daniel,

Tranquilo?

Então, semanticamente o ideal seria usar classes...

<aside>
       <nav class="menu">
            <h1 class="nome">JOÃO DA SILVA</h1>
            <ul>
                <li class="item"><a class="link" href="index.html">Home</a></li>
                <li class="item"><a class="link" href="portifolio.html">Portifólio</a></li>
                <li class="item"><a class="link" href="bio.html">Sobre mim</a></li>
                <li class="item"><a class="link" href="blog.html">Blog</a></li>
                <li class="item"><a class="link" href="contato.html">Contato</a></li>
            </ul>
        </nav>
</aside>

CSS


.menu {
    background-color: #851944;
    padding: 25px;
}

.menu .nome {
    font-size: 30px;
    text-align: center;
}

.menu .item {
    text-align: center;
}

.menu .link {
    font-family: "Open Sans Condensed", sans-serif;
    color: #F2FFFC;
    text-decoration: none;
}

Por que? pelo motivo de deixar mais genérico o seu código CSS, assim se por algum motivo você quiser mudar de h1 para h3 você não precisa alterar o seu CSS, só o seu HTML, e no seu caso de não usar aside nav, apenas nav, tem o impacto de todos os nav da sua página, caso você tenha mais de um, irão herdar as propriedades, usando aside nav você diz que só os navque estão dentro de um aside vão receber as propriedades, e colocando classes, você tira a responsabilidade do HTML, se por ventura algum dia você decidir mudar de nav para div, você altera novamente só o HTML, o CSS continua sem alteração pois ele é genérico e não depende de tags HTML, somente de classes.

Espero ter ajudado!

Abraços!

por Daniel Pôrto Núñez
| 69.4k xp | 38 posts

Perfeita explicação, ainda não cheguei na parte que começa o uso de classes, mas faz todo sentido. Obrigado pela explicação