3. Inserindo e Formatando uma Tabela no Modelo de Documento Eletrônico - Somente para Cadastradores de Modelos de Documentos no Suap.

3.1. No Corpo do Editor de Texto:

a) Clicar no Botão Maximizar a Tela:

b) Aparecerá a seguinte tela:

c) Clicar no botão Tabela:

d) Abrirá a janela Formatar Tabela, conforme figura abaixo:

e) Como exemplo, faremos uma Tabela com 5 Linhas e 3 Colunas, Largura de 750 pixels, Espaçamento = 0 (distância entre as bordas); Borda = 1 (espessura da borda) e Margem Interna da Célula = 7:

f) Clicando no   OK   , teremos a seguinte estrutura de Tabela no documento. Observe que foi criada uma tabela com três colunas de mesma largura e encostada no limite da área de texto (sem margens definidas).

3.2. Configurando a tabela para que ela se enquadre dentro dos limites das margens-padrão do documento:

a) Clicar no Botão Código-Fonte (Acessa o HTML - Hyper Text Markup Language):  

b) Informar a sintaxe para margens esquerda e direita, logo após o valor do "width" = margin-left:2cm; margin-right:2cm

As medidas de margens podem variar de acordo com a necessidade (padrões oficiais estabelecidos) para cada Tipo de Documento. Neste exemplo, estamos utilizando margens de 2cm de cada lado do modelo, que se ajustam às larguras da tabela (750px = Retrato e 1150px = Paisagem). Portanto, caso as margens tenham outras medidas, deve-se buscar a largura da tabela, que se ajustará entre as margens. (Nota adicionada em julho/2022) 

O importante é que a tabela não ultrapasse os limites das margens. Portanto, ela pode ter uma largura menor, e ser centralizada entre as margens. (Nota adicionada em julho/2022)

c) Clicar novamente no Botão: e retorne ao Corpo do Modelo de Documento de Texto:

Veja que a Tabela se deslocou para a direita e este deslocamento se refere aos 2cm da margem esquerda do documento, assim como o final da tabela está a 2cm do limite do papel (margem direita):

Imagem antes de definir as margens:

Imagem após definição das margens (Tabela deslocou para a direita):

3.3. Medidas padrões para largura limite de Tabela 

As medidas apresentadas abaixo se ajustam a um documento com margens esquerda e direita à 2cm. Caso o documento tenha outras medidas de margens, a largura limite da tabela deverá ser ajustada. (Nota adicionada em julho/2022)

O importante é que a tabela não ultrapasse os limites das margens. Portanto, ela poderá ter uma largura menor, e ser centralizada entre as margens. (Nota adicionada em julho/2022)

a) Modo Retrato: a Largura máxima da Tabela, para a impressão/exportação PDF Carta é de 750px, que garante que a tabela não ultrapasse os limites internos das margens direita e esquerda do documento em orientação "Retrato". Veja que a tabela está alinhada aos dados do cabeçalho. O cabeçalho é definido no Tipo de Documento. (O exemplo apresentado é de um documento com margens esquerda e direita = 2cm).

b) Modo Paisagem: a Largura máxima da Tabela, para a impressão/exportação PDF Paisagem é de 1155px, que garante que a tabela não ultrapasse os limites internos das margens direita e esquerda do documento em orientação "Paisagem". (O exemplo apresentado é de um documento com margens esquerda e direita = 2cm).

3.4. Medida da Margem interna da célula

a) A medida "7" é adotada para garantir uma distância harmoniosa entre o texto e as bordas laterais da célula. 

Observe na figura a seguir o distanciamento do texto em relação às bordas - esta distância se refere ao valor "7" (em pixels) atribuído à margem interna da célula, conforme subitem 3.1. e) deste Manual:

Com "7" de margem interna:

Sem a margem "7" - praticamente o texto fica encostado às margens da célula, conforme figura abaixo:

3.5. Fixando a Largura da Tabela:

Pode-se fixar a largura definida para a tabela, para que não haja variação do tamanho da célula quando da digitação do texto. Para isto, substituir a sintaxe:

<table border="1" cellpadding="7" cellspacing="0" style="margin-left:2cm; margin-right:2cm; width:750px">

Por:

<table border="1" cellpadding="7" cellspacing="0" style="margin-left:2cm; margin-rigth:2cm; table-layout:fixed; width:750px">

3.6. Definindo a Largura da Coluna:

a) Marque a coluna e com o botão direito do mouse sobre a opção "Célula", clicar em   Propriedades da célula   :

b) No campo "Largura" definir o tamanho, que pode ser em pixel ou percentual. No caso de pixel, como a largura total da tabela é de 750px ou 1155px, dependendo da orientação do papel (retrato ou paisagem), o somatório das larguras das colunas deve ter o limite de 750px ou 1155px.

Na tabela abaixo, definimos as larguras das colunas em percentual, sendo a coluna 1 = 15%, a coluna 2 = 60% e a coluna 3 = 25%.

c) Clicar em   OK  

d) Repetir os passos a), b) e c)  para definir a largura de cada coluna:

Quando a largura da tabela é "Fixada" e as larguras das colunas são definidas, um mesmo texto inserido é ajustado dentro do limite das larguras definidas às colunas, conforme figura abaixo: 

Inserindo o mesmo texto em uma tabela fixada, porém em colunas sem largura definida. Veja que as larguras da coluna vão se ajustando ao tamanho do texto. Neste caso, por ser o mesmo texto, as larguras das colunas ficaram iguais, conforme figura abaixo:

3.7. Atribuindo cor de fundo e de borda na Tabela:

No exemplo a seguir, atribuiremos a cor vermelha para as bordas e a amarela para o fundo das células

a) Selecionar as células para as quais serão atribuídas as características desejadas, clicar no botão direito do mouse e sobre a opção "Célula", ir em "  Propriedades da célula  " e clicar:

b) Na tela que se abrirá, definir a Cor de fundo e Cor das bordas (pressionando o Botão Escolher à frente desses campos):

c) Clicar em  OK  para ver o resultado:

Resultado das cores atribuídas à Tabela:

 

Padrão que está sendo adotado para todos os Modelos de Documentos Eletrônicos do IFSP (jul/2022)

Elaborado por: Regiani Aparecida da Silva 

Revisado por; Antônio Airton Palladino

IFSP/CEPR-PRD - Versão 01 - julho/2021

IFSP/CEPR-PRD - Versão 02 - julho/2022