11 html css typography spacing
在句子之间呈现应该出现的额外间距的最佳方法是什么(使用[X] HTML + CSS)？
<p>Lorem ipsum. Dolor sit amet.</p>
^^ wider than word spacing
由于HTML和XML都需要空格折叠,因此上述两个空格必须表现为单个空格.
有什么选择？下面有一些明显的,其他的存在？(CSS3中的任何内容？)这些都存在哪些缺点,包括不同的浏览器？(下面的不间断空格如何与换行相互作用？)
..ipsum. Dolor....ipsum. Dolor....ipsum. Dolor..网上有很多FUD声称这是为打字机发明的,但你可以在诸如美国独立宣言等文件中看到它.(是的,我知道你不应该遵循两百多年前的所有惯例,DoI只是一个方便的例子,显示这种早期的打字机和等宽字体.)或者一位印刷工作者声称额外的空间让人分心 - 改变之后背景颜色所以示例不能是其他任何东西!
说白了,虽然我很欣赏有关是否应该使用额外间距的意见和讨论(这与编程无关),这不是我所要求的.假设这是一个要求,实现它的最佳方法是什么？
Bri*_*ell 13
您可以使用white-space: pre-wrap保留空格序列,同时仍然包装文本:
<p style="white-space: pre-wrap;">Lorem ipsum. Dolor sit amet.</p>
在IE 8模式下直到IE 8,在3.0之前的Firefox中也不支持这种情况.
您也可以使用 或 用于一个em或一个en宽的空间.我不知道这些支持有多广泛,但它们似乎适用于Mac OS X上最新的WebKit和Firefox.
两个 字符的序列将防止该空间中的换行; 这 意味着什么,不打破空间.序列A sentence. Another.导致 出现在第二行,略微缩进文本,这可能是不可取的.序列A sentence. Another.工作正常,断行并且不添加任何额外的缩进,但如果您在对齐文本中使用它,并且 在行的末尾,它将阻止该行被正确对齐. 用于编写某人姓名的情况Mr. Torvalds,或者以a结尾的缩写.,其中印刷约定表明你不应该跨行分割,以避免人们混淆并认为句子已经结束.
因此,使用序列 是不合需要的.由于这是一种风格效果,我建议使用white-space: pre-wrap,并接受在不支持它的平台上风格将不太理想.
编辑:正如评论中指出的那样,white-space: pre-wrap不起作用text-align: justify.然而,我已经使用BrowserShots测试了不同实体的采样器(讨厌的广告,有点片状和慢,但它是一个非常有用的价格服务,这是免费的).它看起来像一个漂亮的各种各样的浏览器,在一个相当广泛的平台,支持和中,只有少数不仍然使用空间,以便渲染是不是太糟糕,和IE 6在Windows 2000上竟使他们破,作为盒子.BrowserShots不允许我选择我想要的确切浏览器/操作系统组合,所以我不能在XP上选择IE 6来查看是否有任何不同.所以,只要你能够在Win2K(也许是XP)上使用IE 6,这就是一个看似合理的答案.  
另一种可能的解决方案是找到(或创建)具有用于"."字符组合的字距调整对的字体,以使它们更广泛地分开.此时@font-face支持所有主流浏览器,包括IE回到IE 5.5(虽然IE使用的格式与其他浏览器不同),使用自己的字体实际上变得合理,如果没有,则回退到用户默认字体支持不会破坏任何东西.
最后一种可能性是与CSS委员会讨论添加一个样式特征,这个特征允许你指定你想要在句子末尾有更宽的间距(这将由一个句点后面跟一个空格决定;首字母缩略词和缩写需要一个 为了避免获得更广阔的空间).CSS委员会目前正在讨论增加更高级的排版支持,所以现在可能是开始讨论这种功能的好时机.
小智 5
对于所有“过时”和“仅限单一空间”的反对者 - 阅读一本书。 自古以来，专业出版商就在句子之间使用单个，这就是等宽双空格标准的来源。向历史学习，而不是在没有事实依据的情况下胡言乱语。不过，我不得不承认， 在大多数浏览器中， an看起来更好： 太宽了。你觉得这一段的可读性如何？Stackoverflow 的编辑器允许使用一些 HTML，我 在所有句子之间使用。