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

O que seria a class wrapper

Vejo muita gente usando a class wrapper na estrutura do corpo da aplicação, gostaria de saber o que significa , como se usa?

Poderiam me explicar melhor?

1 resposta
solução!

Bom dia, Ana!

Wrap vem do inglês "embrulhar". Uma wrapper class é uma classe que "embrulha", envolve, outros objetos afim de adicionar algum atributo ao conjunto ou melhor organizar seu código.

É como se você fosse dar de presente várias lembrancinhas para uma pessoa só, e optou por embrulhá-las todas juntas. Por exemplo:

<div class="wrapper">
     <h1>Título</h1>
     <p>Texto</p>
     <a href="/read-more">Leia mais</a>
</div>

Wrappers podem ser usadas em situações como no exemplo acima, onde eu quero dar alguma qualidade, como por exemplo centralizar ou dar algum padding, a um grupo de elementos HTML ou divs.

Com wrapper você também pode blocar conteúdo, separar header e footer do resto do site, posicionar de maneira diferente um grupo de classes, pra facilitar na hora de especificar uma classe no seu CSS ou Javascript, etc.

<style>
.wrapper {
     margin: 0 auto;
     max-width: 1160px;
     padding-left: 40px;
     padding-right: 40px;
}

.footer {
     padding: 25px 0;
}

.theme {
     float: left;
}

.author {
     float: right;
}
</style>

<div class="wrapper">
     <div class="footer">
          <p class="theme">Nome do Tema</p>
          <p class="author">Autor © 2019</p>
     </div>
</div>

Muitas pessoas usam outras terminologias, como container, main, content. Depende muito de como você prefere organizar o seu código, o que você pretende fazer com ele ou qual o seu tipo de conteúdo.