Como criar colunas usando tags DIV

As tags DIV têm uma gama mais ampla de funções que as tags HTML comuns. Você cria um site versátil ao usar esses tipos de ferramentas. As tabelas HTML normais são difíceis de projetar e não são tão flexíveis. DIVs fazem parte do documento HTML. Adicione essas tags sempre que precisar colocar colunas dentro da sua página da web. Depois de ter escrito a cor ou a textura do plano de fundo no documento, você colocará as tags DIV para criar as colunas.

Passo 1

Adicione o código “<div style = ‘” para cada linha separadamente das colunas. Isso explica o objetivo do código inicial.

Etapa 2

Digite os pixels de altura, largura e arestas. O código será exibido como “<div style = ‘height: 550px; largura: 220px; borda: 3px”. Se você não deseja uma borda ao redor de suas colunas, defina o pixel da borda como zero.

Etapa 3

Ajuste a cor da borda. Você pode usar cores iguais ou diferentes. Use “sólido” ou “duplo” para o tipo de borda. Seu código será semelhante “<div style = ‘height: 550px; largura: 220px; borda: 3px preto sólido;”.

Etapa 4

Adicione o alinhamento. O comando “Flutuar” permite alinhar as colunas adicionais ao lado da primeira coluna. Inserir “flutuar: (direção);” para a etiqueta de alinhamento do DIV. O código até o momento é “<div style = ‘height: 550px; largura: 220px; borda: 3px preto sólido; float: left;”.

Etapa 5

Feche a etiqueta DIV. Feche o código com “‘>” e termine com

. Por exemplo, o código completo está neste formato ” “

Etapa 6

Adicione outra coluna ao lado da primeira com outra tag DIV. Por exemplo, se você quiser quatro colunas seguidas, este seria o código:

 

Você pode estar interessado:

Deixe um comentário