5

我正在尝试使用 css 和/或 jQuery 将文本包装在 div 中，以使底线最长。

所以而不是

__________
|this is |
|text    |
|________|

它会说

__________
|this    |
|is text |
|________|

我可以轻松地使用

    white-space: pre-wrap;

但是我找不到任何可以让我这样做的东西。

（我的一个想法是反转文本，找到换行<br/>的位置，在相同的地方应用 a，文本继续前进..但我不知道如何检查换行的位置）

4

2 回答 2

1

他们是 jquery 中的一个插件，叫做bacon

有了这个，您可以根据您的需要将文本包装成您想要的任何形状，我知道您必须对其进行处理，但我认为它可能会对您有所帮助。

$(".baconMe").bacon({
    'type' : 'bezier',
    'c1' : { x : 10,        y : 0  },
    'c2' : { x : -115,      y : 170 },
    'c3' : { x : 35,        y : 340 },
    'c4' : { x : 15,        y : 480 },
    'align'  : 'right'
}
于 2012-05-20T07:10:53.110 回答
0

我最终选择了倒车路线，检查换行符的位置，然后相应地插入它们。请随意使用我的功能。这个函数接受一个 jQuery 元素（带有已经换行的文本），并将它的文本向上重新换行。

function wrapUp(element){
    width = element.width();
    string = element.text().split(' ');
    element.text('');
    reversed = string.reverse();
    var height = 0;
    for (var i=0;i<reversed.length;i++){
        reversed[i] += ' ';
        element.text(element.text()+reversed[i]);
        if (height != element.height()){
            reversed.splice(i,0,"<br/>");
            i++;
        }
        height = element.height();
        console.log(element.height());
    }
    element.html(reversed.reverse().join(''));
}
于 2012-05-20T20:04:56.000 回答