HOME PAGE JAVASCRIPT
Botões Cálculos Datas Essenciais Janelas Flutuantes Menus
HTML CSS FLASH PHP ASP GERADORES CORES MISCELANEA Contato  






Texto

Quando inserimos alguns parâmetros (atributos) na tag de abertura do comando  <font></font> poderemos formatar um texto. A grafia utilizada é como segue abaixo:

<font parâmetro="Valor">

Os parâmetros responsáveis por formatar o texto são os seguintes:

Parâmetro size
O parâmetro size do elemento font é o que define o tamanho do texto e deve ser especificado da seguinte forma:

size="valor" onde valor é um número inteiro de 1 a 7.

exemplo: <font size="3">TEXTO</font>
Resultado:
TEXTO


Parâmetro color
O parâmetro color do elemento font é o que define a cor do texto e deve ser especificado da seguinte forma:

color="valor", onde valor é o código da cor ou o nome da cor na linha inglesa. Click aqui para ver tabela de cores.

exemplo: <font color="#FF0000">TEXTO</font>
Resultado: TEXTO


Parâmetro face
O parâmetro face quando inserido dentro da TAG de abertura <font> define o tipo de letra a ser utilizado e tem a seguinte grafia:

face="xxxxx" onde xxxx é o tipo de letra que se deseja usar.

exemplo: <font face="VERDANA">Este trecho é em Verdana</font>
Resultado:
Este trecho é em Verdana

Embora existam inúmeros tipos de letra, é aconselhável que uma página apenas utilize o Arial, Verdana ou o Times New Roman, visto que com outros tipos de letras existe a possibilidade do visitante da página não ter essa fonte instalada no computador.

É possível inserir símbolos na página com o valor do parâmetro face igual a wingdings ou webdings.

Exemplo: o abre parênteses na font wingdings é um telefone
<p><font face="wingdings" size="7">(</font></p>

Resultado:

(


Dentro da TAG de abertura <font> podemos inserir vários parâmetros ao mesmo tempo, como por exemplo:

<font color="0000FF" size="4" face="Verdana">Cor azul tamanho 4 em Verdana</font>

Resultado: Cor azul tamanho 4 em Verdana

 


Outros comandos que tem a função de formatar o TEXTO

Caso o navegador não reconheça um dos comandos a seguir ele irá substituir por outro equivalente
ou simplesmente ignorará a formatação.
 

Tipo

Comando

Grafia

Exemplo

Negrito

<b></b>

<b>TEXTO</b>

TEXTO

Itálico

<i></i>

<i>TEXTO</i>

TEXTO

Sublinhado

<u></u>

<u>TEXTO</u>

TEXTO

Tachado

<s></s>

<s>TEXTO</s>

TEXTO

Sobrescrito

<sup></sup>

<sup>TEXTO</sup>

TEXTO

Subscrito

<sub></sub>

<sub>TEXTO</sub>

TEXTO

Neste Exemplo  está sendo aplicado o código abaixo:

<font color="#FF0000" size="4" face="Arial"><b><i><u>Exemplo</u></i></b></font>

que significa querer que a palavra exemplo seja visualizada no navegador da seguinte forma:
cor vermelha, tamanho 4, tipo de letra em Arial, em negrito, itálico e sublinhado.

Nos tipos sobrescrito e subscrito podemos ter uma variação da posição conforme exemplificado abaixo.
Exemplo de sobrescrito: Este exemplo tem o objetivo de explicar .......
Código aplicado na palavra exemplo - <sup>exemplo</sup>

Outro exemplo de sobrescrito: Este exemplo tem o objetivo de explicar .......
neste caso foram aplicados 4 comandos do tipo sobrescrito <sup><sup><sup><sup><sup>exemplo</sup></sup></sup></sup></sup>

Exemplos de subscrito: Este exemplo tem o objetivo de explicar .......
neste caso foram aplicados 5 comandos do tipo subscrito.

<font color="#FF0000" size="4" face="Arial"><b><i><u>Ex<sub><sub><sub><sub>
emp</sub></sub></sub></sub>lo</u></i></b></font>

O código acima resulta em:
Exemplo


Mais Comando de Formatação 

Usando as tags <PRE> e </PRE> no código fonte de sua página, todos os espaços e entradas de parágrafo  são respeitados. Em um texto normal, qualquer espaço a mais entre duas palavras é ignorado pelo navegador. Com a pré-formatação, pode-se controlar o espaçamento com a barra de espaço e colocar o texto em praticamente qualquer lugar da página.

Este comando é excelente para apresentar código fonte com os espaçamentos adequados.

O  tag <PRE> muda o tipo de caractere para uma fonte monoespaçada. Uma fonte monoespaçada é aquela na qual todos os caracteres ocupam o mesmo espaço horizontal, ao contrário da fonte proporcional, na qual o "l" ocupa menos espaço do que o "m".
Exemplo: 

    Este texto está pré-formatado. Portanto a fonte é monoespaçada e as entradas de parágrafo,

     assim como os espaços adicionais (resultado da tecla enter), s ã o   
r  e  s  p     e     i  t  a  d  o  s.

É possível colocar tags de título dentro do par <PRE> e </PRE>, permitindo a manutenção da fonte proporcional  (Arial, por exemplo). Na maioria dos navegadores, porém, as tags de título são ignorados e se sobrepõem aos tags de pré-formatação, eliminando o seu efeito. Se você não estiver vendo a palavra respeitados no exemplo acima na cor vermelha e fonte Arial o seu navegador ignora as tags de título.

 


<EM></EM>
Indica que os caracteres deverão ser evidenciados de alguma forma. De forma diferente do restante do texto. Geralmente em itálico.

Exemplo:<em>Evidenciado</em>
Resultado:
Evidenciado


 


<STRONG></STRONG>
Evidencia mais que a anterior. Em negrito.

Exemplo: <STRONG> Muito evidenciado </STRONG>
Resultado:
Muito evidenciado

 


<CODE></CODE>
Indica um código de exemplo a ser exposto.

Exemplo: <CODE>Codigo</CODE>
Resultado: Codigo


 


<SAMP></SAMP>
Indica texto de exemplo. Quando você quer dar um exemplo de endereço para a Internet sem criar link.

Exemplo: <SAMP>http://www.kithomepage.com</SAMP>
Resultado: http://www.kithomepage.com

 


Níveis de Cabeçalho
Os níveis de cabeçalho foram criados para dar uma ordem de importância para o texto a ser apresentado.

Grafia: <Hx> </Hx> onde x é um número inteiro de 1 a 7. 
exemplos:
<H1>
Texto</H1>
<H2>
Texto</H2>
<H3>
Texto</H3>
<H4>
Texto</H4>
<H5>Texto</H5>
<H6>
Texto
</H6>


Na caixa de Teste on-line abaixo você poderá configurar e testar um texto aplicando um código acima.

Teste on-line:


Entidades de caracteres do HTML 4.01

Alguns caracteres têm significados especiais em HTML como por exemplo o sinal de maior e menor > <. Sempre que precisar visualizar esses caracteres no conteúdo da página deve-se usar um código especial que o navegador interpreta e substitui por um caractere específico.
Por exemplo: para que o navegador não interprete como sendo um comando e exiba "<isto não é um comando>" da forma como está sendo apresentado é necessário digitar de uma das seguintes formas: &lt;isto não é um comando&gt; (consulte a tabela B)
&#60;isto não é um comando&#62; (consulte a tabela B)

Evite utilizar a acentuação do seu teclado ao digitar o código fonte de uma página,  pois os resultados podem ser diferentes em outros computadores com configuração diferente de vídeo e teclado.
Ao invés de digitar pão no código fonte digite p&atilde;o  (consulte a tabela A).

Tabela A

Caractere

Notação

Acento agudo &Xacute;
Acento grave &Xgrave;
Acento circunflexo &Xcirc;
Letra com til &Xtilde;
Letra com trema &Xuml;

onde X é uma letra acentuável, maiúscula ou minúscula

 


A norma ISO utiliza um código composto pelo caractere & seguido do símbolo # e, então, de uma combinação numérica com ponto-e-vírgula. Já a entidade HTML usa o caractere & seguido de uma palavra que identifica o símbolo com ponto-e-vírgula.

Tabela B

Aparência Descrição Entidade HTML Norma ISO
  inserir espaço ("non-breaking space") &nbsp; &#160;
< menor que &lt; &#60;
> maior que &gt; &#62;
& "e" comercial &amp; &#38;
" aspas &quot; &#34;
Euro &euro; &#8364;
¢ centavos (de dólar) &cent; &#162;
£ libra esterlina &pound; &#163;
¥ yen &yen; &#165;
§ section &sect; &#167;
© direitos de cópia ("copyright") &copy; &#169;
® marca registrada &reg; &#174;
× sinal de multiplicação &times; &#215;
÷ sinal de divisão &divide; &#247;

Mais Entidades