O objetivo aqui é entender o espaçamento de cada parte da sua loja virtual. Vamos dizer que para facilitar o entendimento, separamos ela por BOX e elementos. Dentro de um box podem existir de 1 a 4 elementos.
Pois vejamos: você está montando um box com 4 produtos e quer que ele fique mais afastado do conteúdo de cima, porém quer que fique mais pertinho do conteúdo de baixo. Está criando um texto e quer que o mesmo fique mais afastado das laterais e que tenha um certo espaço entre si. Sim, tudo é possível. Depois que você dominar os espaços poderá brincar e deixar seu site do seu jeito.
Você sabe o que é um box, certo? Do contrario, leia este artigo antes de seguir e tudo ficará mais fácil: O que é um box?
Vamos com calma, é tudo bem detalhado mas fácil de entender. A janela de edição do box com todas suas opções é essa:Vamos ver cada um dos pontos dessa caixa de edição.MARGEM SUPERIOR DO BOX
MARGEM HORIZONTAL INTERNA DO BOX
Pois vejamos: você está montando um box com 4 produtos e quer que ele fique mais afastado do conteúdo de cima, porém quer que fique mais pertinho do conteúdo de baixo. Está criando um texto e quer que o mesmo fique mais afastado das laterais e que tenha um certo espaço entre si. Sim, tudo é possível. Depois que você dominar os espaços poderá brincar e deixar seu site do seu jeito.
Você sabe o que é um box, certo? Do contrario, leia este artigo antes de seguir e tudo ficará mais fácil: O que é um box?
Vamos com calma, é tudo bem detalhado mas fácil de entender. A janela de edição do box com todas suas opções é essa:Vamos ver cada um dos pontos dessa caixa de edição.MARGEM SUPERIOR DO BOX
- Quanto espaço você vai querer dar entre este box e o box de cima? Este número determina se o seu box ficará mais ou menos afastado do conteúdo de cima. Prove e veja a diferença.
- É a mesma coisa que o de cima, porém pensando para a parte de baixo. Este número determina se o seu box ficará mais ou menos afastado do conteúdo de baixo.
- Essa é a margem superior entre os elementos dentro do box e o próprio box. Por exemplo, você vai usá-la quando quiser aplicar um fundo no seu box.
- Essa é a margem inferior entre os elementos dentro do box e o próprio box. Igual ao de cima, porém pensando na parte de baixo do box.
MARGEM HORIZONTAL INTERNA DO BOX
- Esta margem é muito parecida com as duas últimas que vimos, é o espaço que você terá entre os elementos do seu box e a margem do box.
- Essa margem é o espaço entre cada elemento dentro do box. Por exemplo, você adicionou 4 elementos produtos e quer separar um pouco eles, então dê mais margem entre elementos. Agora, se você adicionou 4 imagens e quer elas coladas umas nas outras, deixe em 4 e você terá este efeito.
Fica a dica: tente usar as margens sempre com os mesmos números, de forma que tudo na sua página tenha simetria. Colocou 40 em um? Coloque no outro também.