我想将标题文本拉伸到给定的宽度,根据需要添加字符间距,以便单词在整个h1上延伸。 text-align:justify似乎没有这样做。标题只是一行。这有可能用CSS吗?
答案 0 :(得分:3)
CSS3支持text-justify:newspaper属性。但是在大多数浏览器中都不支持它。
同时,你可以试试这个jQuery Character Justification Plugin。
答案 1 :(得分:1)
CSS中没有特别的内容,但如果你的h1
只是一个单词,这就是一种愚蠢的方法:
<h1 style="text-align: justify;">
D o e s t h i s w o r k ?
</h1>
基本上,如果你强迫那里有一个软线断裂,那么完全对齐会延伸第一行的所有内容来填补。
修改:
另一个具有相同基本想法的hacky替代方案是:
<div style="overflow: hidden; width: 100%">
<h1 style="text-align: justify;">
S t r e t c h e d<img style="width: 9000px; height: 0;" />
</h1>
</div>
答案 2 :(得分:0)
text-align才会合理。我很确定你无法证明一线测试的合理性。
我错了吗?
所有需要静态内容的解决方案,例如多个&amp; nbsp;如果只有一个H1进行格式化,那么字母间距技巧会很好,但根据所使用的浏览器和操作系统,它会有不同的渲染方式,所以它们都是 WRONG 解决方案,事件最差,&amp; ; S; NBSP;技巧会失去文本的语义感,并可能会干扰读取页面的自动脚本(包括抓取工具)。
除了生成图像之外,没有解决方案。
答案 3 :(得分:0)
如果您知道使用letter-spacing
属性需要多少间距,则可以静态执行此操作:
h1 {
letter-spacing: 20px;
}
答案 4 :(得分:0)