我是否应该避免使用“文本对齐:对齐;”?

首先,这纯粹是一个与设计相关的问题和解决方案。网格的设计指定是否需要证明文本。我认为仅仅使用justify align对可用性没有重大影响。糟糕的排版使文本难以辨认,这降低了可用性。这就是说,确保你的字体有坚实的对比和良好的间距平衡。字体大小也很重要。

This site 是一个成功的尝试,证明文字在线。由于CSS无法像InDesign一样控制字母和单词之间的空格,因此很难对文本进行对齐,也很难让“河流”般的空格沿行延伸,当单词之间的空格超过行之间的空格时就会发生这种情况。使证明文本正确性变得困难的事情:长单词、容纳不够单词的行宽、文本和背景颜色之间的对比度过大;它们使河流看起来更宽、更明显。

排版的理想是有一个均匀的文本块,如果你眯着眼睛,文本块就会变成一个均匀的实心阴影。所以,如果你把文本保持在10px左右,60%的白色背景上是灰色的,并且有可以容纳20个单词的行,那么“对齐对齐对齐”看起来就不会难看了。但请记住,这并不能提高可用性。小而轻的文本让很多人感到烦恼,尤其是老年读者。

我应该注意到这一点 ­ (软连字符)正确地分隔长而麻烦的单词,例如Superwesome,您可以模拟正确的排版(例如InDesign)。这对你有很大的帮助。我建议在客户端隐藏、操作和显示文本的逻辑,可能是使用 this .

编辑 :正如其他人在下面提到的, css hyphens css4 offers even more control .

text-align: justify shouldn't be used 在目前的浏览器中。他们不善于处理内部的细节,输出结果包含大量河流,并且不支持 hyphenation (软连字符除外)。

笔记 上面是4.5年前写的。事情正在慢慢改变。。。 http://caniuse.com/#feat=css-hyphens

编辑: Hyphenator 在这个回答的评论中引起了我的注意。它似乎使文本对齐变得值得使用,请查看使用它的网站。在使用此脚本之前,您可能希望使用javascript应用文本对齐对正,以便不使用javascript的用户不会被发现。

编辑2: hyphenation 和 hyphens browser support ]PPK现在对我说 add it to your stylesheets Eric Meyer说 just add it for mobile .

编辑3: A good little overview

其他人提出的关于对齐的问题在窄柱上更为普遍。如果您的列相对于字体大小和其他参数足够宽,那么可以调整文本。假设你希望平均每行至少有12到15个单词。越多越好。

你最好的选择是避免辩解。

我想不出一个令人信服的理由来证明文本的合理性——在某一点上,内容的数量和宽度几乎要求它是合理的。当然,你会遇到由某些单词组合组成的内容的问题,但在我看来,如果你看到单词之间的河流和异常大的空格,你会有一个完全不同的问题——可读性和清晰度。

无论如何,我要避免的是居中的正文。我不认为有一个更大的危险信号的Ammateuris网页设计比这。

我更喜欢左对齐(text align:left),因为它通常更可读。我听说读等距单词更快。除非您有使用justify的风格原因,否则请将其保留在左侧、右侧或中间。特别是对于正文文本,请使用left。(事实上,您可能希望在另一个方向的文本(例如希伯来文)中使用类似“前进”的内容。)

我想我以前在StackOverflow上拉过这个网站,但是 Jon Tan

不应在不使用连字符的情况下使用对正。这是一个 PHP based hyphenation library ,以及此库到WordPress插件的端口: wp-Typography

我认为它在打印上是完全可以的,但在大多数Web浏览器上,由于缺乏对间距和连字号的精细控制,它很笨重。在某些情况下,印刷师甚至可以稍微调整字母间距或字体收缩,因为页面/专栏(至少在杂志中)可以微调。

呃。。。不

[严肃地说]WordPress使用了justify,我认为这是一个关于它是否会降低可读性的非常有力的说法。。。

你也可以使用文本对齐:报纸。文本对齐css标记可帮助您控制对齐时如何包装文本

应该提到的是,InternetExplorer(至少)在版本8之前不会呈现 text-align: justify text-align: center .

text-align: justify

让我头疼的是为什么我总是把东西放在中心。也许这能为别人节省一些时间。

文本对齐可以通过几种方式完成。

两个定义:调整单词之间的间距是“跟踪”,调整字符之间的间距是“紧排”。好的布局程序会自动进行一些紧排,并且会因字母对的不同而有所不同。变量的va可以比xa更精确地紧排。好的字体有内置的字距调整提示表来帮助这一过程。

在单空格字体的早期,它是通过在单词之间插入额外的空格来实现的。这使得输出非常笨重。如果在行的末尾有4个空格,在行中有6个空格,其中4个将成为双空格。

单空格字体不应该是对的。

对于可变宽度字体,我们有em空格、en空格等,因此空间可以更好地分布。

我认为这是大多数浏览器现在的位置。它在大多数情况下运行得相当好。要使其正常工作,需要满足以下条件:

• 你需要在一行上有合理的字数。
• 一行末尾的一个大字可能会产生问题。

如果行中有10个单词,那么需要为每个单词间隙添加大约一半的标准空格。

这就是断字词典发挥作用的地方。断字可以通过算法来完成,但有足够多的例外情况,有一个字典会有很大帮助。(对于字典中没有的单词,软连字符有一个特殊字符。)

连字号可以分割一个单词,使行填充更均匀。

另一种对齐方法是在字符之间分割空格。这避免了上面的一些问题,但如果您在不够的行中分配了大量空间,则仍然看起来很奇怪。你偶尔会在报纸上看到这一点,每个字之间似乎都有一个完整的空格。这是一个很好的论据,支持更长的行。

好的排版程序(InDesign、*TeX、Framemaker)在字间间隙和字符间的微小额外空间之间进行组合。

块上有一个新的kid,text-justify,可以在CSS中使用它来修改text-align:justify的用法。名义上它接受这些选择

• 中间词

犬科动物 https://caniuse.com/#search=text-justify CSS工作组 https://drafts.csswg.org/css-text-3/#text-justify-property

• 最大线路长度为65雷姆
• 领先增长至125%

结果是,网站上的时间和每个会话的页面翻了一番。