Estilos de texto em HTML5

Índice

Os estilos básicos mais usados ​​são o alinhamento do texto e a justificativa, isso nos ajuda a localizar o texto e torná-lo mais compatível com o ambiente, vamos imaginar que devemos colocar um resumo de uma notícia e queremos que ela se destaque outro texto, poderíamos fazer o seu alinhamento ficar focado para que alcancemos o destaque que queríamos no início.
Para conseguir isso, usaremos duas propriedades:

1. alinhamento de texto: Especifica o alinhamento de um bloco de texto pode assumir os valores: início, fim, esquerda, direita, centro, justificar.

2. justificar o texto: Especifica a técnica que será usada para justificar o texto quando justificar for escolhido no alinhamento de texto.

Vamos ver um pouco de código onde aplicamos isso:
 Exemplo

Existem muitos tipos diferentes de frutas - existem mais de 500 variedades de banana. No momento em que adicionamos os incontáveis ​​tipos de maçãs, laranjas e outras frutas conhecidas, nos deparamos com milhares de opções. Um dos aspectos mais interessantes da fruta é a variedade disponível em cada país. Eu moro perto de Londres, em uma área conhecida por suas maçãs.

Iniciar Fim Esquerda Direita Justificar Centro


Nesta parte do código, o que fizemos foi criar um roteiro com linguagem Javascript que nos permite mudar o atributo de alinhamento de texto para que, ao executá-lo em nosso navegador, possamos ver a diferença entre cada um dos valores de propriedade do atributo. Vamos ver como temos algumas dessas propriedades aplicadas no navegador:

PROLONGAR

Aqui podemos notar que a tela esquerda que aplicamos Centro que nos permite centralizar o texto e na tela certa aplicamos certo o que nos dá a capacidade de alinhar o texto à direita.
Agora vamos ver outra das características de HTML5 quando um texto possui espaços em branco, duplos ou triplos, o navegador costuma substituí-los por um único espaço, como linhas em branco, ele os ignora, para trabalhar com ele temos a propriedade espaço em branco, ela pode assumir os seguintes atributos:
  • normal: É o valor padrão no navegador, ignora vários espaços e novas linhas.
  • nowrap: Neste caso, os espaços são ignorados, mas as quebras de linha são respeitadas.
  • pré: O espaço em branco e apenas as quebras de linha são preservados.
  • pré-linha: O espaço é ignorado, mas a quebra de linha é respeitada.
  • pré-embalagem: O espaçamento de branco é respeitado e haverá quebra de linha quando especificado ou quando exigido pelo bloco.

Vejamos um exemplo:
 Exemplo

Existem muitos tipos diferentes de frutas - existem mais de 500 variedades de banana. No momento em que adicionamos os incontáveis ​​tipos de maçãs, laranjas e outras frutas conhecidas, nos deparamos com milhares de opções. Um dos aspectos mais interessantes da fruta é a variedade disponível em cada país. Eu moro perto de Londres, em uma área conhecida por suas maçãs.


Como podemos ver, incluímos vários espaços duplos no texto e indicamos que usaremos a propriedade pré-linha, Vamos ver o que o navegador nos mostra:

Como podemos ver, respeitou apenas as quebras de linha, porém os espaços em branco foram alterados para espaços simples.
wave wave wave wave wave