Adicionar uma tabela a um editor de HTML

Adicione e formate uma tabela [n exemploa um artigo de conhecimento usando controles de campo HTML.

Antes de Iniciar

Função necessária: administrador

Por Que e Quando Desempenhar Esta Tarefa

Nesta tarefa, você cria e formata uma tabela em htmlArea ou TinyMCE v6.8.3. As tabelas resultantes devem ser semelhantes a uma das imagens a seguir.

Figura 1. Exemplo de tabela em htmlArea

Figura 2. Exemplo de tabela no TinyMCE v6.8.3

Se você inserir valores alternativos para aspectos como largura, espaçamento de célula, preenchimento de célula, borda e alinhamento, a tabela resultante variará dos exemplos fornecidos.

Procedimento

1. Navegar até Todos > Conhecimento > Editar e selecione o conhecimento artigo que você deseja editar.
2. No campo HTML, posicione o cursor no local onde você deseja adicionar a tabela.
3. Selecione o ícone de tabela, selecione Inserir tabelae selecione o número de linhas e colunas.
4. Edit as propriedades da tabela.
   1. Posicione o cursor na tabela, selecione o ícone da tabela e selecione Propriedades da tabela.
   2. Insira os seguintes valores na guia Geral.
      • Largura: 75%
      • Espaçamento da célula: 3
      • Preenchimento da célula: 3
      • Borda: 1
      • Alinhamento: à esquerda
   3. Na guia Avançado, selecione o campo de texto ao lado de Cor da borda e insira Cinza.
      A caixa do seletor de cores fica cinza para indicar a cor que você inseriu. Você também pode marcar a caixa e selecionar as cores na paleta.
   4. Selecione Ok.
5. Update a linha da tabela de cabeçalho.
   1. Selecione as células na primeira linha da tabela, selecione o ícone da tabela e selecione Linha > Propriedades da linha.
   2. Insira os seguintes valores na guia Geral.
      • Tipo de linha: cabeçalho
      • Alinhamento: central
   3. Na guia Avançado, insira #87cefa na caixa de texto ao lado de Cor de fundo para defini-la como azul claro.
   4. Selecione Ok.
6. Set a tabela propriedades da célula.
   1. Selecione todas as células da tabela na primeira coluna, exceto as células na linha de cabeçalho.
   2. Seleger o ícone da tabela e selecionar Célula > Propriedades da célula.
   3. Insira os seguintes valores na guia Geral:
      • Alinhamento H: Esquerda
      • Alinhamento V: superior
   4. Selecione Ok.
   5. Repita essas etapas para as células da tabela na segunda coluna.
7. Set a cor de fundo da linha do meio.
   1. Posicione o cursor na linha do meio da tabela, selecione o ícone da tabela e selecione Linha > Propriedades da linha.
   2. Na guia Avançado, insira Prata na caixa de texto ao lado de Cor de fundo para defini-la como a cor #c0c0c0.
   3. Selecione Ok.
   4. Repita este procedimento para todas as outras linhas da tabela.
8. Set a largura da colunas.
   1. Selecione a primeira coluna da tabela, selecione o ícone da tabela e selecione Célula > Propriedades da célula.
   2. Na guia Geral, insira 30% no campo de texto Largura.
   3. Selecione Ok.
9. Selecione e segure (ou clique com o botão direito) o cabeçalho do formulário e escolha Salvar.
10. Insira os dados nas células da tabela e salve o artigo.