Uma das propriedades da tipografia de um site que você pode escolher ajustar durante o desenvolvimento de um site é como o texto do site é justificado. Por padrão, o texto do site é justificado à esquerda e é assim que muitos sites deixam seu texto. As únicas outras opções são justificadas à direita, o que é raro, ou totalmente justificado. Texto justificado é um bloco de texto que é alinhado à esquerda e à direita, em oposição a apenas um desses lados (que é o que as justificações “esquerda” e “direita” fazem). O efeito duplamente justificado é obtido ajustando-se os espaços de palavra e letra em cada linha de texto para garantir que cada linha tenha o mesmo comprimento. Este efeito é denominado justificação completa. Justifique o texto em CSS usando o alinhamento de texto propriedade.
Como funciona a justificação?
O motivo pelo qual você costuma ver uma borda irregular no lado direito de um bloco de texto é que cada linha de texto não tem o mesmo comprimento. Algumas linhas têm mais palavras ou palavras mais longas, enquanto outras têm menos palavras ou palavras mais curtas. Para justificar esse bloco de texto, espaços extras devem ser adicionados a algumas linhas para uniformizar todas as linhas e torná-las consistentes. Cada navegador da web tem seu próprio algoritmo para aplicar os espaços extras em uma linha. Os navegadores examinam o comprimento da palavra, a hifenização e outros fatores para determinar onde colocar os espaços. Como resultado, o texto justificado pode não parecer idêntico de um navegador para o outro. No entanto, tenha certeza de que o suporte principal do navegador é bom para justificar texto com CSS.
Como Justificar Texto
Justificar texto com CSS requer uma seção de texto para justificar. Normalmente, você usará parágrafos de texto porque grandes blocos de contexto de texto que se estendem por várias linhas serão marcados com tags de parágrafo. Depois de ter um bloco de texto para justificar, é só uma questão de definir o estilo como justificado com a propriedade CSS text-align style. Aplique esta regra CSS a um seletor apropriado para fazer com que o bloco de texto seja renderizado como pretendido.
Quando justificar o texto
Muitas pessoas gostam da aparência do texto justificado do ponto de vista do design, principalmente porque ele cria uma aparência muito consistente e medida, mas há desvantagens em justificar totalmente o texto em uma página da web. Primeiro, o texto justificado pode ser difícil de ler. Isso ocorre porque, quando você justifica o texto, às vezes é possível adicionar muito espaço extra entre algumas palavras na linha. Essas lacunas inconsistentes podem tornar o texto mais difícil de ler. Isso é especialmente importante em páginas da web, que podem ser difíceis de ler devido à iluminação, resolução ou outra qualidade do hardware. Adicionar espaços incomuns ao texto pode piorar ainda mais a situação. Além dos desafios de legibilidade, os espaços em branco às vezes se alinham para criar “rios” de espaço em branco no meio do texto. Essas grandes lacunas de espaço em branco podem realmente causar uma exibição estranha. Além disso, em linhas extremamente curtas, a justificação pode causar linhas que contenham uma palavra com espaços extras entre as próprias letras. Então, quando você deve usar justificação de texto? O melhor momento para justificar o texto ocorre quando as linhas são longas e o tamanho da fonte é pequeno – algo que é difícil de garantir em sites responsivos em que o comprimento das linhas muda com base no tamanho da tela. Não há um número rígido e rápido para o comprimento da linha ou o tamanho do texto; você deve usar seu bom senso. Depois de aplicar o estilo de alinhamento de texto para justificar o texto, teste-o para garantir que o texto não tenha rios de espaço em branco – e teste-o em vários tamanhos. O teste mais fácil não requer nada mais complicado do que seus próprios olhos semicerrados. Os rios se destacam como manchas brancas em um bloco de texto cinza. Se você vir rios, deve fazer alterações no tamanho do texto ou na largura do bloco de texto para refluir o texto. Use a justificação somente depois de compará-la ao texto alinhado à esquerda. Você pode gostar da consistência da justificação completa, mas o texto padrão justificado à esquerda é geralmente mais legível. No final, você deve justificar o texto porque optou por justificá-lo para fins de design e confirmou que seu site permanece fácil de ler.
Formato mla apa chicago Sua Citação
Kyrnin, Jennifer. “Como definir texto justificado com CSS.” ThoughtCo, maio. 14 de 2021, thinkingco.com/set-justified-text-with-css-3467074.
Kyrnin, Jennifer. (2021, 14 de maio). Como definir texto justificado com CSS. Obtido em https://www.thoughtco.com/set-justified-text-with-css-3467074
Kyrnin, Jennifer. “Como definir texto justificado com CSS.” ThoughtCo. https://www.thoughtco.com/set-justified-text-with-css-3467074 (acessado em 17 de junho de 2021).
