<1> <2> <3> <4> <5> <6> <7> <8> <9> <10> <11> <12> <13> <14> <15> <16>

 

Li��o 9 - Textos preformatados

 

Cria��o de texto formatado. O tipo de caracter, o espa�o, o tab e o return podem influenciar a apresenta��o de uma p�gina ou de parte dela. A solu��o � a pr�-formata��o.

Objetivos
  Criar uma tabela de texto alinhado
  Controlar a coloca��o de texto em uma p�gina onde tab's e espa�os s�o importantes.

 

Li��o

N�s j� vimos que, por default, um browser WWW ignora espa�os extras e caracteres de retorno de carro (CR). Entretanto, existem inst�ncias onde � importante controlar estes aspectos de layout de p�gina. Nesta li��o, o exemplo ser� a inclus�o de uma tabela de texto com alinhamento por colunas.

O r�tulo de preformato instrui seu browser para apresentar o texto exatamente como escrito no documento HTML, incluindo espa�os e retornos de carro. Os browsers normalmente apresentam tal texto como espa�o simples. Um exemplo de r�tulo preformatado: 


   <pre>

    Este texto est� identado em 5 espa�os.

    Usando Carriage Return para saltar

    para

    uma

    nova

    linha.



          Aqui     n�s

          usamos

          espa�os  para

          criar    uma

          tabela   texto.    

   </pre>

Sem os r�tulos <pre> e </pre>, o mesmo HTML produziria:

 

Este texto est� identado em 5 espa�os. Usando Carriage Return para saltar para uma nova linha. Aqui n�s usamos espa�os para criar uma tabela texto.

 

Com o r�tudo pre, � interessante se o editor de texto que voc� usa pode apresentar o texto em uma fonte mono-espa�ada (tal como "courier"); se n�o voc� ter� que contar os espa�os e caracteres para alinhar textos em colunas.

Na nossa li��o, n�s incluiremos uma tabela de dist�ncias rodovi�rias de Joinville � outras cidades. Para fazer isso:

  1. Abra o arquivo de trabalho.
  2. Procure o header Dist�ncias Rodovi�rias.
  3. Abaixo deste cabe�alho, entre o seguinte texto: 
    
<pre>

             Cidade             Dist�ncia (Km)            

             --------          --------------   

             S�o Paulo               535  

             Curitiba                135

             S. Francisco do Sul      45

             Ubatuba                  57

             Enseada                  63

             Barra do Sul             40

             Barra Velha              45

             Pi�arras                 60

             Itaja�                   88

             Blumenau                130

             Bal. Cambori�            92

             Itapema                 102

             Lages                   337

             Itapo�                   80

             S�o Joaquim             458

             Imbituba                270

             Laguna                  300

             Caxias do Sul           568

             Porto Alegre            700

             S�o Bento do Sul         75

             Rio Negrinho             90

             Campo Alegre             60

             Jaragu� do Sul           51

             Florian�polis           184

             Brusque                 117

             Pomerode                 71

             Assun��o               1135

             Montevid�o             1550

             Buenos Aires           1950

</pre>
  4. Salve e Recarregue o arquivo HTML.

 

Revis�o

  1. Como o r�tulo de preformatado muda a forma como o browser apresenta um texto?
  2. Em que outras situa��es pode ser �til tal r�tulo?

Pr�tica Independente

Acrescente uma tabela ao seu pr�prio documento HTML usando o r�tulo de preformatado.

 

A seguir...

Usando caracteres especiais para acrescentar

����t�

nas suas p�ginas.

 

Página Inicial | Índice |