Como controlar o espaçamento de palavras em texto justificado com CSS?


9

Eu tenho 2 blocos de texto que são muito pequenos (pouco menos de um parágrafo cada) e eles realmente parecem mais justificados, mas o problema é que text-align: justify;às vezes adiciona espaços realmente grandes e torna o texto um pouco feio (o efeito oposto, obviamente).

É possível ajustar com mais precisão o espaçamento da palavra com CSS para que isso não aconteça?

Respostas:


9

CSS TEXT-JUSTIFY

Essa propriedade somente para o IE oferece um refinamento no valor "justificar" usado na text-alignpropriedade. De fato, o valor "justificar" deve ser definido para que essa propriedade text-justifytenha algum efeito.

text-justify oferece um bom nível de controle de justificativa sobre o conteúdo incluído, permitindo uma variedade de modelos sofisticados de justificativa usados ​​em diferentes sistemas de escrita de idiomas.

Exemplo

<p style="text-align: justify; text-justify: newspaper;">
    This is Newspaper justified content
</p>

Valores possíveis

VALUE                   DESCRIPTION
----------------------  ---------------------------------------------------------------------
auto                    The browser will determine the appropriate justification algorithm
                        to use

distribute              Justification is handled similarly to the newspaper value,
                        but this version is optimized for East Asian content
                        (especially the Thai language.)
                        In this justification method, the last line is not justified.

distribute-all-lines    Behavior and intent for this value is the same as with the
                        distribute value, but the last line is also justified.

inter-cluster           Justifies content that does not have any inter-word spacing
                        (such as with many East Asian languages.)

inter-ideograph         Used for justifying blocks of ideographic content.
                        Justification is achieved by increasing or decreasing spacing
                        between ideographic characters and words as well.

inter-word              Justification is achieved by increasing the spacing between words.
                        It is the quickest method of justification and does not justify
                        the last line of a content block.

newspaper               Spacing between letters and words are increased or decreased
                        as necessary.

A referência do IE diz que "é a forma mais sofisticada de justificação para os alfabetos latinos".

Fonte: http://www.css3.com/css-text-justify/

Espero que isto ajude!


Isso parece ser suportado por outros navegadores agora.
Mndrix

3

Além de usar text-justify, que parece ser atualmente suportado apenas pelo IE, considere adicionar hifenização, com dicas explícitas de hifenização &shy;e / ou hifenização automática baseada em navegador, usar hyphens: autocom os prefixos de navegador adequados ou usar hifenizador baseado em JavaScript como Hyphenator.js. A hifenização geralmente reduz bastante a necessidade de espaçamento adicional na justificação.


The text-justify property is supported in all of the major browsers., Fonte: w3schools.com/cssref/css3_pr_text-justify.asp e text-align, w3schools.com/cssref/pr_text_text-align.asp

3
@AbdiasSoftware, a página é falsa - mais uma prova de que o w3schools é uma porcaria, consulte w3fools.com (a página w3schools contém botões "PlayIt", que você pode usar para ver rapidamente que suas informações estão erradas.)
Jukka K. Korpela

Eles são um pouco desatualizado às vezes, mas eu não os chamaria de falsa :-) Aqui é de qualquer maneira uma outra fonte: reference.sitepoint.com/css/text-align

@AbdiasSoftware, a outra fonte é sobre outra propriedade. O site reference.sitepoint.com não menciona text-justifynada. Mas lamento ter inicialmente escrito sobre, em text-align-justifyvez de text-justify(corrigido agora). A configuração text-align: justifyé obviamente implícita aqui; a questão é se o tipo de justificação pode ser controlado.
Jukka K. Korpela

Bem, bem interessante. Vou fazer mais algumas pesquisas. Obrigado. É de quatro horas aqui, o meu juízo é off :-)
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.