Entrar Ainda não tem acesso?
1
resposta

[Dúvida] Bloco ou elemento?

Referente ao curso Arquitetura CSS: descomplicando os problemas, no capítulo Estilização de Banner e Sobre e atividade Criando o banner e sobre

por Thaynara Lima da Silva
| 82.5k xp | 59 posts

Estou com dúvida no que seria bloco e no que seria elemento.

No curso o instrutor disse que header, img e nav seria um bloco, mas que o ul é um elemento por ser filho de um bloco (do nav neste caso). Porque então que o img e nav são blocos invés de elementos já que ele é filho do block cabecalho? Por que devemos nomear o nav e a img de logo e menu invés de "cabecalho__logo" e "cabecalho__menu"? E os li links que estão do ul é elemento também? 

<header class="cabecalho"> 
            <img class="logo" src="assets/img/logo.jpg" alt="Fruta e Fruto">
            <nav class="menu"> 
                <ul class=""> 
                    <li class=""><a class="" href="#">Início</a></li>
                    <li class=""><a class="" href="#">Receitas</a></li>
                    <li class=""><a class="" href="#">Quem somos</a></li>
                    <li class=""><a class="" href="#">Comunidade</a></li>
                </ul>
            </nav>
        </header>
1 resposta
por Fábio Henrique Araújo
| 82.7k xp | 37 posts
Analista de Sistemas

Olá Thaynara, boa tarde, tudo bem?

Respondendo à sua pergunta, img e nav são elementos sim, a nomenclatura utilizada, muito provavelmente, foi por questão de praticidade e facilidade de enetendimento, porém, pela estrutura da convenção BEM, img e nav teriam ficado:

<header class="cabecalho"> 
    <img class="cabecalho__logo" src="assets/img/logo.jpg" alt="Fruta e Fruto">
    <nav class="cabecalho__menu"> 
        <ul class="menu"> 
            <li class="menu__item"><a class="menu__link" href="#">Início</a></li>
            <li class="menu__item"><a class="menu__link" href="#">Receitas</a></li>
            <li class="menu__item"><a class="menu__link" href="#">Quem somos</a></li>
            <li class="menu__item"><a class="menu__link" href="#">Comunidade</a></li>
        </ul>
    </nav>
</header>

tomei também a liberdade de colocar onde não tinha, pra te ajudar nos estudos futuros.

Bons estudos!

  • "A vida é uma coisa frágil, e a única coisa que importa é o que fazemos com ela." - Dr. Beverly Crusher