Pode adicionar tabelas às suas páginas web para ajudar a estruturar texto, imagens ou objetos numa página. Pode fazê-lo para mostrar dados numa tabela, numa lista de preços, numa comparação de produtos, numa lista de termos e definições, e assim por diante. Também pode fazê-lo para posicionar conteúdos, por exemplo, mostrar biografias dos empregados, as suas informações de contacto ou horas de trabalho. Este artigo explica como posicionar ou estruturar conteúdo numa página usando o editor de tabela no seu website e outros métodos como HTML e CSS.
Neste artigo
Inserir uma tabela
Para inserir uma tabela numa página, muito na sua conta Microsoft 365, abra o editor do site e siga estes passos.
-
Navegue na página web onde pretende adicionar a tabela.
-
Clique no separador Página.
-
Clique no botão Editar.
-
Clique na página onde pretende adicionar a tabela.
-
Clique no separador Inserir.
-
Clique no botão Tabela.
-
Há duas maneiras de adicionar a tabela:
-
Clique na seta para expandir as linhas de mesa, sobreponha o ponteiro do rato sobre as linhas de mesa e, em seguida, clique no número desejado de células de mesa.
-
Ou, clique no botão Insert Table, digite o número de colunas e linhas que desejar, e clique OK.
-
-
A tabela é adicionada à sua página web, onde pode começar a adicionar conteúdo ou personalizá-lo, tarefas que são descritas a seguir.
Personalize uma mesa
Assim que inserir uma tabela na sua página web, pode começar a personalizá-la. Pode adicionar e eliminar linhas ou colunas, fundir e dividir linhas ou colunas, redimensionar a tabela, alterar a aparência, e assim por diante.
Adicionar linhas e colunas
Pode adicionar linhas e colunas de células numa tabela para permitir um conteúdo mais estruturado na página. Pode adicioná-los acima, abaixo, à esquerda ou à direita da célula onde o cursor está localizado. Apenas linhas ou colunas inteiras podem ser adicionadas ao mesmo tempo em vez de células individuais.
Para adicionar linhas ou colunas numa tabela
-
Edite a página web que contém a sua tabela.
-
Coloque o cursor na célula de mesa onde pretende adicionar a linha ou coluna.
-
Clique no separador layout da tabela.
-
Selecione uma das seguintes opções:
-
Insira acima para adicionar uma linha acima da célula selecionada.
-
Insira abaixo para adicionar uma linha abaixo da célula selecionada.
-
Insira à esquerda para adicionar uma coluna à esquerda da célula selecionada.
-
Insira o Direito para adicionar uma coluna à direita da célula selecionada.
-
Sugestão: Se não gostar do resultado das novas células, pode desfazer a ação digitando CTRL + Z ou clicando no separador Formato Texto e escolhendo Undo.
Verá as alterações aplicadas imediatamente à sua mesa. Se tivesses texto ou imagens nas células, elas serão colocadas juntas na nova célula fundida.
Unir células
Quando se fundem células, combina-se duas ou mais células para permitir mais espaço para texto, imagens e outros objetos na tabela. Pode fundir células acima ou abaixo umas das outras e à esquerda ou à direita umas das outras, mas só pode fundir células individuais e não linhas ou colunas inteiras.
Para fundir células numa mesa
-
Edite a página web que contém a sua tabela.
-
Coloque o cursor na mesa que quer fundir.
-
Clique no separador layout da tabela.
-
Clique em Células de Fusão e escolha uma das seguintes:
-
Funda-se acima para fundir-se com a célula acima.
-
Funda-se abaixo para fundir-se com a célula abaixo.
-
Fundir à esquerda para fundir com a célula à esquerda.
-
Fundir o Direito de fundir com a célula à direita.
-
Sugestão: Se não gostar do resultado das células fundidas, pode desfazer a ação digitando CTRL + Z ou clicando no separador Formato Texto e escolhendo Undo.
Verá as alterações aplicadas imediatamente à sua mesa. Se tivesses texto ou imagens nas células, elas serão colocadas juntas na nova célula fundida.
Dividir células
Quando se dividem células, transformam-se uma única célula em duas células para aplicar mais estrutura ao conteúdo da tabela. Pode dividir as células horizontal ou verticalmente, mas só pode dividir células individuais e não linhas ou colunas inteiras.
Para dividir células numa mesa
-
Edite a página web que contém a sua tabela.
-
Coloque o cursor na cela de mesa que queira dividir.
-
Clique no separador layout da tabela.
-
Clique em Células Divididas e escolha uma das seguintes:
-
Divida a Horizontal para dividir a célula em duas células, lado a lado.
-
Divida verticalmente para dividir a célula em duas células, uma sobre a outra.
-
Sugestão: Se não gostar do resultado das células divididas, pode desfazer a ação digitando CTRL + Z ou clicando no separador Formato Texto e escolhendo Undo.
Verá as alterações aplicadas imediatamente à sua mesa. Se tivesses texto ou imagens na cela, elas permanecerão na cela original e não na nova.
Redimensionar a mesa
Pode alterar o tamanho de uma mesa, bem como as linhas e colunas individuais que compõem a mesa. Pode fazê-lo para encaixar mais conteúdo de página numa célula de mesa ou fazer mais espaço no resto da página para outros conteúdos. Pode especificar o tamanho da tabela ou da célula em píxeis (px) ou em percentagem (%). Apenas toda a linha, coluna ou mesa pode ser redimensionada ao mesmo tempo em vez de células individuais.
Para alterar o tamanho da mesa
-
Edite a página web que contém a sua tabela.
-
Coloque o cursor dentro da mesa que queira redimensionar.
-
Clique no separador layout da tabela.
-
Ao lado da Largura da Tabela, introduza um valor por cento ou pixel. Um valor de 100% ou 700px ou mais utiliza toda a área de conteúdo da página.
-
Ao lado da Altura da Mesa,introduza um valor por cento ou pixel. Tenha em mente que o número de parágrafos também determina a altura da mesa.
-
Ao lado da Largura da Coluna,introduza um valor por cento ou pixel. Um valor de 100% ou 700px ou mais utiliza toda a área de conteúdo da página.
-
Ao lado da Altura da Coluna,introduza um valor por cento ou pixel. Tenha em mente que o número de parágrafos também determina a altura da mesa celular.
Sugestão: Se não gostar do resultado da tabela ou das células redimensionadas, pode desfazer a ação digitando CTRL + Z ou clicando no separador Formato Texto e escolhendo Undo.
Verá as alterações aplicadas imediatamente à sua mesa. Se tivesses texto ou imagens nas células, elas permanecerão na célula redimensionada.
Mude o estilo da mesa
Pode personalizar a aparência de uma mesa alterando o seu estilo, designando um cabeçalho ou uma linha de rodapé, e aplicando formatação especial na primeira e última linha de mesa ou coluna.
Para mudar o estilo de mesa
-
Edite a página web que contém a sua tabela.
-
Coloque o cursor na mesa que pretende personalizar.
-
Clique no separador Site.
-
Escolha uma das seguintes opções de estilo de mesa. (Pode não ver diferenças de formatação se o estilo de mesa "Light" ou "Clear" for aplicado na sua mesa.)
-
Header Row aplica formatação especial para a primeira linha da tabela.
-
Footer Row aplica formatação especial para a última linha da mesa.
-
A Primeira Coluna aplica formatação especial à primeira coluna da tabela.
-
Última Coluna aplica formatação especial à última coluna da tabela.
-
-
Escolha um estilo de mesa. Cada estilo muda a cor da borda, a cor da pilha e o cabeçalho ou a cor do rodapé. (Alguns estilos só mudam o cabeçalho e o rodapé se selecionar essa opção acima.)
-
Estilo de mesa padrão – Luz:Bordas finas, leves e cinzentas da grelha.
-
Estilo mesa 1 – Claro:Sem fronteiras visíveis.
-
Estilo de Mesa 2 – Light Banded: Linhas horizontais cinzentas claras, todas as outras linhas cinzentas sombreadas.
-
Estilo de Mesa 3 – Médio Dois Tons: Cabeçalho azul, todas as outras linhas são azul claro sombreado.
-
Estilo de Mesa 4 – Linhas de luz: Cabeçalho cinzento, linhas horizontais azuis claros.
-
Estilo de Mesa 5 – Grelha:Bordas da grelha cinzenta, todas as outras filas sombreadas cinza.
-
Estilo de Mesa 6 – Acento 1:Bordas da grelha azul, cabeçalho azul.
-
Estilo de mesa 7 - Sotaque 2; Fronteiras da grelha azul clara, cabeçalho azul claro.
-
Estilo de Mesa 8 – Acento 3:Bordas verdes da grelha, cabeçalho verde.
-
Estilo de Mesa 9 – Acento 4:Bordas da grelha de oliveira, cabeçalho de azeitona.
-
Estilo mesa 10 – Acento 5:Bordas da grelha vermelha, cabeçalho vermelho.
-
Estilo mesa 11 – Acento 6:Bordas da grelha roxa, cabeçalho roxo.
-
-
Clique em Mostrar Linhas de Grelha para mostrar ou esconder linhas de grelha de mesa. Isto é simplesmente uma ajuda visual no caso de aplicar o Estilo de Mesa Clara ou de outra forma ter escondido as bordas da mesa, mas ainda precisa de ver a mesa para trabalhar com ele.
Verá as alterações aplicadas imediatamente à sua mesa. Se tivesse texto ou imagens na célula, permanecerão na célula original com o novo estilo aplicado.
Adicione texto ou objetos à mesa
Quando terminar de personalizar a tabela, está pronto para começar a adicionar conteúdo à mesa, como texto, gráficos e outros objetos descritos aqui.
Para adicionar texto ou objetos à mesa
-
Edite a página web que contém a sua tabela.
-
Coloque o cursor dentro da célula de mesa onde pretende adicionar conteúdo.
-
Para adicionar texto, basta começar a digitar o texto ou colar o texto na célula de mesa. Para alterar o tipo de letra ou o tamanho da fonte, clique no separador Texto do Formato e escolha as definições de fonte a partir daí.
-
Para inserir uma imagem, vídeo ou outro objeto, clique no separador Insert e insira o objeto como faria em qualquer uma das suas páginas web. (Se a imagem ou vídeo for maior do que a célula de mesa, a célula de mesa será automaticamente redimensionada para se adaptar à imagem ou ao vídeo.)
-
Para remover o texto, imagens ou objetos, selecione-o na célula e prima Delete no teclado.
Eliminar uma célula, linha, coluna ou mesa
Pode eliminar células individuais, linhas, colunas ou toda a tabela, se necessário.
Para apagar uma célula, linha, coluna ou tabela
-
Edite a página web que contém a sua tabela.
-
Coloque o cursor dentro da célula, linha, coluna ou na mesa que pretende eliminar.
-
Clique no separador layout da tabela.
-
Clique em Apagar e escolha um dos seguintes:
-
Elimine o Cell para eliminar a célula individual onde o cursor está localizado.
-
Elimine a Coluna para apagar a coluna onde o cursor está localizado.
-
Elimine a Linha para apagar a linha onde o cursor está localizado.
-
Excluir tabela para apagar toda a tabela onde se encontra o cursor.
-
Continue a personalizar a tabela ou conteúdos na página.
Crie a sua própria tabela, conteúdo HTML ou CSS
Se quiser criar uma tabela personalizada ou utilizar o seu próprio código HTML com CSS para posicionar o conteúdo numa página, pode fazê-lo criando o seu código HTML num editor de página web como Expression Web ou Dreamweaver. Faça as suas alterações no editor e, em seguida, copie e cole o código da página web no seu site público seguindo estes passos.
Adicione uma tabela personalizada ou código de página web ao seu site
-
Editar a página web para a qual pretende adicionar uma tabela ou conteúdo HTML.
-
Clique no separador Texto de Formato e, em seguida, clique em Editar Fonte no grupo Markup.
-
Na janela HTML Source, digite ou colhe o seu HTML personalizado ou modifique o conteúdo de origem existente, como a aplicação de etiquetas DIV. (A janela HTML Source também é uma forma útil de copiar uma tabela de uma parte do seu website para outra, que é mais rápida do que recriar e personalizar uma tabela.)
-
Clique em OK e, em seguida, guarde a página.
-
Para personalizar ainda mais o HTML (por exemplo, utilizando camadas CSS), clique no separador Site e, em seguida, clique em Editar Folha de Estilo.
-
Na janela Editar Style Sheet, adicione o seu CSS personalizado e, em seguida, clique em Guardar.
Sugestão: Para personalizar ainda mais o layout e o posicionamento dos conteúdos numa página, poderá considerar criar um layout de página personalizado usando o Gestor de Design.