Funções de tabela no TinyMCE

  • Versão de lançamento: Washingtondc
  • Atualizado 1 de fev. de 2024
  • 1 min. de leitura
  • O TinyMCE versão 4 usa menus e seleções de menu para criar e editar tabelas.

    Tabela 1. TinyMCE versão 4
    Elemento de IU Ação
    Figura 1. Menu Tabela
    Menu da tabela TinyMCE v4
    Clique no ícone de tabela (ícone de tabela TinyMCE v4) para acessar o menu de tabela TinyMCE versão 4. Use o menu da tabela para:
    • Inserir ou excluir uma tabela
    • Modificar propriedades da tabela
    • Adicionar, mover ou excluir linhas e colunas
    • Modificar propriedades de linha e coluna
    • Dividir e mesclar células
    Figura 2. Grade de inserção de tabela
    Grade de inserção de tabela TinyMCE v4

    Para inserir uma tabela no campo HTML, clique em Inserir tabela e realce os quadrados na grade para representar o número desejado de linhas e colunas. Clique no último quadrado realçado para inserir a tabela.

    Depois de inserir a tabela, você pode modificar o tamanho clicando e arrastando as alças nas bordas da tabela.

    Figura 3. Propriedades da tabela
    Propriedades da tabela TinyMCE v4
    No menu da tabela, clique em Propriedades da tabela para abrir a caixa de diálogo Propriedades da tabela. Nessa caixa, você pode realizar qualquer uma das ações a seguir.
    • Guia Geral:
      • Definir largura e altura da tabela
      • Definir espaçamento e preenchimento de célula
      • Habilitar bordas e legendas
      • Definir o alinhamento da tabela
    • Guia Avançado:
      • Configurar o estilo de tabela
      • Selecione a cor da borda
      • Selecione a cor de fundo
    Figura 4. Propriedades da célula
    Propriedade de célula da tabela TinyMCE v4
    Com o cursor na célula da tabela desejada, abra o menu da tabela e clique em Propriedades da célula. Nessa caixa, você pode definir as seguintes propriedades para células de tabela.
    • Guia Geral:
      • Largura e altura
      • Tipo e escopo
      • Alinhamento horizontal e vertical
    • Guia Avançado
      • Configurar o estilo da célula
      • Selecione a cor da borda
      • Selecione a cor de fundo
    Figura 5. Propriedades da linha
    Propriedade de linha da tabela TinyMCE v4
    Com o cursor em uma célula de tabela na linha desejada, abra o menu da tabela e clique em Propriedades da linha. Nessa caixa, você pode definir as seguintes propriedades para linhas.
      • Tipo de linha
      • Alinhamento
      • Altura
    • Guia Avançado
      • Configurar o estilo de linha
      • Selecione a cor da borda
      • Selecione a cor de fundo

    Você também pode colar tabelas em campos HTML de editores baseados em tabela.