Como Inserir Espaços no HTML

As Entidades:  , &ensp; e &emsp;

Insira Espaços Diretamente nos seus Documentos HTML sem o uso de CSS?

Aqui você terá um apanhado básico de como usar espaços do HTML de forma prática.

Parágrafos

O uso da tag   por si só gera quebra de linhas entre sentenças criando parágrafos mesmo com sentenças escritas na mesma linha.


<p>Primeiro parágrafo.</p>

<p>Segundo parágrafo</p>

Entidade   (non-breaking space)

Para criar regras de tabulações, podemos utilizar a entidade  , &ensp; e &emsp;

Veja exemplos:

<p>Portal&nbsp;do&nbsp;Economaster</p>
<p>Portal do Economaster</p>
<p>Portal&ensp;do&ensp;Economaster</p>
<p>Portal&emsp;do&emsp;Economaster</p>

Usando os códigos acima, o documento HTML apresentará os efeitos abaixo:

Portal do Economaster

No documento HTML mesmo se você apertar a tecla espaço 4 vezes, o navegador só contará o uso de um espaço entre sentenças de caracteres, Por isso o uso da entidade   é uma verdadeira mão na roda.

Uma outra utilização para a entidade   é o de criar espaços maiores entre parágrafos.

Veja exemplos:

<p>Primeiro parágrafo</p>
<p>Segundo parágrafo</p>

Primeiro parágrafo

Segundo parágrafo

Agora com a entidade  :

<p>Primeiro parágrafo</p>
<p>Segundo parágrafo</p>

Primeiro parágrafo

Segundo parágrafo

É como se existisse um parágrafo oculto ou um espaçamento maior entre parágrafos. Mas essa não é a melhor forma.

Espaço com a tag (break)

A melhor forma de inserirmos linhas entre parágrafos é usando uma quebra de linhas (break lines).

Veja exemplo a seguir usando a tag  

<p>Como quebrar linhas<br/>mesmo usando a tag de parágrafo</p>

Como fica do documento HTML:

Como quebrar linhas
mesmo usando a tag de parágrafo

Agora usando a tag   para inserir linhas:

<p>Inserindo quebra de<br/><br/><br/><br/>quatro linhas</p>

Inserindo quebra de

quatro linhas

Usando e em textos HTML

Existe uma pequena diferença entre os espaços criados no uso das tags  e  .

Nas tags de parágrafos , por padrão, existe uma margem em torno de 1em, enquanto que se usarmos uma quebra isso não existe, ou seja, com uma quebra de linha, apena criamos mais uma linha com espaçamento diferente daquela oriunda da criação de um novo parágrafo.

Vejamos o exemplo abaixo do poema Pontinho de vista, de Pedro Bandeira.

<p>Eu sou pequeno, me dizem,<br/>
e eu fico muito zangado.<br/>
Tenho de olhar todo mundo<br/>
com o queixo levantado.</p>
<p>Mas, se formiga falasse<br/>
e me visse lá do chão,<br/>
ia dizer, com certeza:<br/>
- Minha nossa, que grandão!</p>

Agora vejamos como o texto fica no documento HTML com as devidas marcações  e  :

Eu sou pequeno, me dizem,
e eu fico muito zangado.
Tenho de olhar todo mundo
com o queixo levantado.

Mas, se formiga falasse
e me visse lá do chão,
ia dizer, com certeza:
– Minha nossa, que grandão!

Observe que o texto fica mais bonito visualmente e que a distância entre os parágrafos é diferente de uma quebra simples de linha.

Aliás, espero que tenha gostado desse Formatador e limpador de códigos de Tabelas HTML do MS Excel.

Certamente esses websites também podem te interessar:

Origamania.com – Origamis, papel modelismo, artesanatos e aviões de papel.
Textículos.com – Significados de Nomes, frases famosas, ferramenta de textos e letras diferentes, e muito mais.
Portal do Economaster – Economia e Finanças de um jeito fácil de entender.
Cardápio de Receitas – Receitas de dar água na boca. Tudo o que você precisa pra fazer uma boa receita.
Mortadela Show – Muito assunto divertido, guia do cubo mágico, curiosidades e muito mais.

Por fim, veja mais conteúdos do Web-ZoneWare, seu site de tecnologia na web a fim de encontrar o que precisa.