> ## Documentation Index
> Fetch the complete documentation index at: https://docs.xquiz.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# Container

<iframe className="aspect-video w-full rounded-xl" src="https://www.youtube.com/embed/jzgqpDN4NIE" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />

O elemento Container serve como um separador visual para organizar e estruturar melhor o layout da sua página. Ele não permite incluir elementos dentro dele, mas funciona como um bloco de apoio para destacar ou separar partes da sua comunicação.

**Para que serve**

* Criar divisões visuais na página.

* Separar seções para melhorar a leitura e o design.

* Destacar trechos com fundo, bordas ou espaçamento diferenciado.

**O que você pode configurar**

**Bordas:**

* Mostrar: ativa ou desativa a borda ao redor do container.

* Estilo: tipo de linha da borda (sólido, tracejado etc.).

* Largura: espessura da borda.

* Raio: arredondamento dos cantos.

* Cor: cor da borda.

**Fundo:**

* Mostrar: ativa ou desativa a área de fundo do container.

* Padding: define o espaço interno.

* Sombra: aplica sombra para dar profundidade.

* Cor: define a cor de fundo.

**Configurações Gerais:**

* Espaçamento: define a margem externa entre esse bloco e os demais.

* Animação: escolhe um efeito de entrada para o container.

* Alinhamento: define o alinhamento do container.

* Tamanho: controla o comprimento do container.

**Dica de uso!**

Use containers para estruturar melhor a página, separar partes importantes do conteúdo ou criar “respiros visuais”. Mesmo sem conter outros elementos dentro, ele ajuda muito na estética e organização.