Question

;有可能吗？

我有很多单行的段落，它们都需要最多1行（由于我对每个段落的各种功能）。我可以用css将它们全部设置为宽度，或者（我现在拥有的）：

var max = 0;
$(this).find('p').each(function(){
    if ($(this).width() > max)
        max = $(this).width();    
    });
    $(this).find('p').width(max);
});

text-align: justify; <<< does nothing to one line

但有没有办法证明一条线？没有或有字母间距计算？或者工作css3解决方案？

Answer 1

我知道会be an answer使用:after。

p {
    text-align: justify;
}
p:after {
  content: "";
  display: inline-block;
  width: 100%;
}

http://jsfiddle.net/Q5kxP/1/

简单有效。解决问题的道具Vjeux。

Answer 2

这是一个有效的答案。就像我上面提到的，你可以确定1行段落的高度，并在任何较小的段落上运行此jquery。使用SPAN内部包装你的段落，这将允许你获得文本行的宽度。

接下来找到P宽度和SPAN宽度之间的差异，这将为您提供从线条末端到边缘的间距。然后，您可以将其除以文本中的空格数，为您提供所需的单词间距，以证明您的行。

HTML，innerWrap所有带有span的P标签:(或者你也可以用jquery来做）

<p><span>This is my one line paragraph</span></p>

jQuery，做一些数学运算：

$('p').each(function() {
    var pHeight = $(this).height();
    var pWidth = $(this).width();

    if (pHeight <= 20) {
        // Get the width of the span:
        var spanWidth = $(this).find('span').width();

        // Get the width difference between the P and Span
        var widthDiff = pWidth - spanWidth;

        // Count # of spaces:
        var spaces = $(this).html().split(' ').length - 1;

        // Divide to find word spacing:
        var spacing = widthDiff / spaces;

        $(this).css('word-spacing',spacing);
    }
});

在JSFiddle上查看：http://jsfiddle.net/wjmZP/3/

Answer 3

尝试确定单行段落的最大高度，假设它是24px。

$('p').each(function() {
    var pHeight = $(this).height();
    if (pHeight <= 24) {
        $(this).addClass('justify');
    }
});

// css
p.justify { text-align: justify; }

一旦你找到魔法高度数，你应该没事。

任何证明单段行的理由？

3 个答案: