Como criar colunas de tamanhos diferentes em HTML

Escrito por ryan voss | Traduzido por vinícius albuquerque
  • Compartilhar
  • Tweetar
  • Compartilhar
  • Pin
  • E-mail
Como criar colunas de tamanhos diferentes em HTML
As colunas são um dos métodos mais básicos para formatar texto no papel (Jupiterimages/Photos.com/Getty Images)

Organizar o conteúdo de um site em colunas e linhas é um dos pontos mais fortes do HTML enquanto linguagem de marcação. Com pouco código é possível criar colunas e linhas, visíveis ou não, para formatar a página em quase qualquer configuração imaginável, sem depender de frames ou quaisquer outras soluções alternativas que podem causar problemas para os usuários.

Nível de dificuldade:
Moderadamente fácil

Outras pessoas estão lendo

O que você precisa?

  • Processador de texto

Lista completaMinimizar

Instruções

  1. 1

    Abra no processador de textos o documento HTML no qual deseja adicionar colunas.

  2. 2

    Crie uma tabela no lugar que quiser inserir as colunas utilizando tags de tabela, como as seguintes: <table></table>. Se desejar que as bordas ao redor das colunas sejam visíveis, insira um espaço e digite o código border="1" na tag <table>, entre a palavra "table" e o símbolo ">", a fim de que fique assim: <table border="1"></table>. Todo o código adicional usado para criar as colunas será inserido entre essas tags.

  3. 3

    Insira tags de dados de tabela para cada coluna que deseja criar. As tags para uma única coluna são estas: <td></td>. Todo o conteúdo que preencherá as colunas será inserido entre as tags de dados de tabela dessas colunas. Por exemplo: se quiser criar duas colunas, uma com o texto "coluna 1" e outra com "coluna 2", o código deve ser assim: <table border="1"><td>coluna 1</td><td>coluna 2</td></table>.

  4. 4

    Insira os valores para os atributos de tamanho de cada tag inicial de dados de tabela a fim de definir o tamanho da coluna. Para isso, adicione à tag um espaço e o código height="" width="", entre "td" e o símbolo ">". Depois adicione os números, em pixels, entre as aspas para determinar a altura e a largura da coluna. Todas as colunas que estiverem na mesma linha serão redimensionadas para a mesma altura da coluna mais alta, mas a largura pode ser editada individualmente.

  5. 5

    Adicione o conteúdo que quiser nas colunas que desejar. Se o conteúdo inserido for maior que a largura definida para a tabela, sua largura será redimensionada automaticamente para contê-lo. Se o conteúdo for maior do que o tamanho geral definido para a coluna, sua altura será automaticamente redimensionada para que possa contê-lo.

Não perca

Filtro:
  • Geral
  • Artigos
  • Slides
  • Vídeos
Mostrar:
  • Mais relevantes
  • Mais lidos
  • Mais recentes

Nenhum artigo disponível

Nenhum slide disponível

Nenhum vídeo disponível