从底部到顶部包装文本 [英] Wrap text from bottom to top

问题描述

任何人都知道我如何能以相反的顺序，从下到上包装文本？
我附上了一个示例图片。

Anybody know how I could wrap the text in reverse order, from bottom to top? I attached an example image.

PS精细的问题：而不是打破线后，它是满的，并有一个不完整的行在结束...我需要从底部到顶部，因此底部线是满的，顶线是不完整的刹车。

P.S. refined question: Instead of breaking the line after it is full and having an incomplete line at the end... I need to brake somehow from bottom to top, so bottom lines are full and top line is incomplete.

推荐答案

我不建议使用异常的CSS属性，甚至在Chrome& Firefox。最好的跨浏览器解决方案是在文档加载时在Javascript中处理这个。这是一个如何做的草图：

I would not recommend using exotic CSS attributes which aren't even in Chrome & Firefox yet. The best cross-browser solution is to handle this in Javascript when the document loads. Here's a sketch of how to do that:

$(function() {
    $(".title").each(function(i,title) {
        var width = 0;
        var originalHeight = $(title).height();
        var spacer = $('<div style="float:right;height:1px;"/>').prependTo(title);
        while (originalHeight == $(title).height()) {
            spacer.width( ++width );
        }
        spacer.width( --width );
    });
});

工作JSFiddle在这里： http://jsfiddle.net/zephod/hfuu3m49/1/

Working JSFiddle is here: http://jsfiddle.net/zephod/hfuu3m49/1/

这篇关于从底部到顶部包装文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！