Scroll Top

Aprenda tudo que você precisa para criar o seu negócio na internet.  São 30 vídeos aulas totalmente gratuitas. Basta se cadastrar em um de nossos formulário.

Tutoriais

Criar Fontes – Mini curso de HTML – Parte 5

criar fontes

Criar Fontes

Usando um editor de texto ou de códigos como Notepad++  (baixe a versão 5.9.8 do Notepad++  Aqui ) vamos apender como criar fontes em uma página de um site, se você é iniciante em negócios na internet, precisa aprender a trabalhar com HTML, para criar seus negócios online.

 

 

A TAG <FONT>
Permite que você insira em sua página um texto com fontes de tamanhos, cores e tipos diferentes.

Veja como fica o comando:
<FONT SIZE=”n” FACE=”nome” COLOR=”cor”> texto </FONT>

Onde:
ß SIZE=”n”: n varia de 1 a 7 é o tamanho da fonte onde o valor 3 é  padrão para maioria dos navegadores;
ß FACE=”nome”: nome da fonte a ser utilizada, que pode ser a mesma que você tem no seu editor Microsoft Word;
ß COLOR=”cor”: cor da fonte definida em hexadecimal, ou através de um nome pré-definido de cores, use o Photoshop para copiar as suas cores preferidas, este aplicativo para edição de imagem fornece códigos para qualquer cor.

Exemplo:
Salve o código abaixo  como formatando_fontes.html na sua área de trabalho para criar fontes usando os mesmos nomes de fontes que você tem no seu editor de texto WordPress;

<HTML>
<HEAD>
<Title>Formatando Fontes</Title>
</HEAD>
<BODY>
<FONT SIZE=”5″ FACE=”TimesNewRoman” COLOR=”#9898f8″>Texto com Fonte</FONT>
<FONT SIZE=”7″ FACE=”Calibri” COLOR=”#060401″>Texto com Fonte </FONT>
<FONT SIZE=”6″ FACE=”Arial” COLOR=”#072f81″> Texto com Fonte </FONT>
<FONT SIZE=”3″ FACE=”Georgia” COLOR=”#810707″> Texto com Fonte </FONT>
</BODY>
</HTML>

 

Abra o seu navegador, deverá ficar assim:

 

formatando_fontes

 

Observações:
Caso a fonte face indicada para sua página não esteja disponível para o usuário que visitar a sua página, a fonte utilizada então será a padrão do navegador utilizado pelo visitante;  Caso a primeira não esteja instalada no sistema do usuário, o browser reconhece a próxima Fonte como a  definida; Assim podemos criar fontes bonitas e adequadas para cada tipo de página.

 

Criar Fontes para Estilos de Texto

Como nos editores de texto, além dos tamanhos das fontes, você pode modificar o estilo de texto. Pode-se atribuir o negrito, itálico, sublinhado entre outros, abaixo relacionados: 

Tabela de estilos:

COMANDO APLICANDO O ESTILO FUNÇÃO 

Negrito <B> Texto </B> Atribui o estilo negrito
Itálico
<I> Texto </I> Atribui o estilo itálico
Sublinhado <U> Texto </U> Atribui o estilo sublinhado
Strong <STRONG> Texto </STRONG> Semelhante ao estilo negrito
Ênfase <EM> Texto </EM> Semelhante ao estilo itálico
Typewriter <TT> Texto </TT> Espaço regular ao texto
Big
Small <SMALL> Texto </SMALL> Reduz e altera a fonte
Sobrescrito <SUP> Texto </SUP> Eleva o texto e eleva o seu corpo
Subscrito <SUB> Texto </SUB> Rebaixa o texto e diminui seu corpo
Pulsante <BLINK> Texto </BLINK> Faz o texto ficar pulsante

Exemplo:

<BIG> Texto </BIG> Aumenta a fonte e atribui negrito

Salve o código abaixo como estilo_de_texto.html

<HTML>
<HEAD>
<Title>Estilos de Texto</Title>
</HEAD>
<BODY>
<B> Texto em Negrito </B> Atribui o estilo negrito
<I> Texto Intálico </I> Atribui o estilo itálico
<U> Texto Sublinhado</U> Atribui o estilo sublinhado
<STRONG> Texto Semelhante do Estilo Negrito</STRONG> Semelhante ao estilo negrito
<EM> Texto Semelhante ao Estilo Itálico</EM> Semelhante ao estilo itálico
<TT> Texto (Espaço Regular ao Texto BIG)</TT> Espaço regular ao texto Big
<SMALL> Texto (Reduz e Altera a Fonte)</SMALL> Reduz e altera a fonte
<SUP> Texto(Eleva o Texto e Eleva o seu Corpo) </SUP> Eleva o texto e eleva o seu corpo
<SUB> Texto(Rebaixa o Texto e Demininui o seu Corpo) </SUB> Rebaixa o texto e diminui seu corpo
<BLINK> Texto (Faz o Texto Ficar Pulsante)</BLINK> Faz o texto ficar pulsante
</BODY>
</HTML>

Abra o arquivo no seu navegador e veja o resultado, deve ficar semelhante ao da imagem abaixo para criar fontes:

estilo de texto

 

 

Criar Fontes com Acentos e Caracteres Especiais

Os arquivos HTML, não podem conter nenhum tipo de formatação ou caracteres especiais(símbolos ou letras acentuadas). Para criar fontes em uma página com caracteres especiais, deve-se utilizar alguns códigos especiais que o browser interprete e substitua por um caractere específico. Um bom exemplo seria representar uma TAG sem que o browser interpretasse como uma TAG. Escrevendo a TAG= <BODY>. Para representá-la os sinais<>= &lt;BODY&gt;
Encontra-se em anexo uma tabela com uma lista de códigos e caracteres especiais mais utilizados.
Os navegadores mais atualizados reconhecem alguns caracteres como descrito abaixo ao criar fontes especiais:

Exemplo: 

<HTML>
<HEAD>
<TITLE>Veja alguns acentos e caracteres especiais </TITLE>
</HEAD>
<BODY>
<br>&agrave; (a primeira letra após o & é a letra que receberá o acento que está após a letra, neste caso é o (a) e o acento grave)
<br>&atilde;
<br>&acirc;
<br>&auml;
<br>&eacute;
<br>&egrave;
<br>&ecirc;
<br>&iacute;
<br>&igrave;
<br>&otilde;
</BODY>
</HTML>

Salve o código acima como caracteres_especiais.html

Abra o arquivo no seu navegador e deverá ficar assim:

criar fontes

 

 

Criar Fontes com Quebras de Linha

A TAG <BR>

Faz uma quebra de linha sem acrescentar espaços extras entre elas. Finaliza a linha do texto e insere automaticamente uma outra linha em branco. Não necessita ser finalizada com </BR> , é simples criar fontes com este comando.


Exemplo:

<HTML>
<HEAD>
<TITLE> Utilizando a quebra de linhas com a TAG <BR> </TITLE>
</HEAD>
<BODY>
Este texto está utilizando a TAG BR no final de cada linha<BR>
<BR> Você pode utilizar<BR> a TAG BR<BR> toda vez que<BR> você quiser passar o texto<BR> para a próxima linha.<BR>
<BR>O resultado é simples.
</BODY>
</HTML>

Salve o código acima como quebra_de_linhas.html na sua área de trabalho, depois abra o arquivo no seu navegador e deve aparecer o seguinte resultado:

criar fontes

 

Note que as linhas de textos onde a tag <BR> está no início, apárece uma linha em branco abaixo do texto, mas quando a tag <BR> está no final do texto, o texto é quebrado onde for colocado a Tag <BR>.

Aprendemos aqui como criar fontes usando diversos tipos de comando no HTML, estes parâmetros são interpretados pelos sites de buscas como o Google e outros da forma que demostramos aqui.  Agora continue o estudo com as próximas aulas, onde aprenderemos outras coisas para criar um site em HTML.

 

Leia Aqui a Parte 4

Leia Aqui a Parte 6

Está Gostando do Artigo?

Se inscreva em nossa lista e receba 30 vídeos aulas grátis, ensinando como criar o seu negócio na internet a partir do zero.

| Website

Sou blogueiro por que gosto de ler e escrever. Criei este blog para te ajudar a criar o seu negócio na internet e ter um novo estilo de vida.

  • I just want to tell you that I am just new to blogging and absolutely savored you’re blog site. Most likely I’m likely to bookmark your blog . You really have terrific article content. Thanks a bunch for sharing with us your web site.

    Tradução:
    Eu só quero te dizer que eu sou apenas novo em blogs e absolutamente saboreado você blog. O mais provável é que eu sou provavelmente para marcar o seu blog. Você realmente tem conteúdo do artigo fantástico. Muito obrigada por compartilhar conosco o seu web site.

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.
error: Este conteúdo está protegido ! Se precisar de alguma coisa envie mensagem pelo formulário de contato.