html – 倾斜的文本容器

我想知道,如果有人知道是否有可能做任何看起来像这样：

我知道约http://www.infimum.dk/HTML/slantinfo.html,但我不能把任何文字放在倾斜的地方.

解决方法

有一点javascript： http://jsfiddle.net/billymoon/AvmE8/

但这只是为了方便起见,你可以用HTML做同样的事情.

不会适用于所有情况,需要一点调整,但可以为您所知道的大概长度 – 或者知道上限的事情做出努力.

HTML：

<div id='left'>whatever text</div><div id='right'>random text</div>

CSS：

#left,#right{
    text-align: justify;
    position: absolute;
    width:60%;
    right:0;
}
#right{
    right:auto;
    left:0;
}

JS：

for (i = 1; i < 40; i++) {
    $('<div />').css({
        border: '1px solid silver',height: 10,width: (5 * i),float: 'left',clear: 'left'
    }).prependTo($('#left'))
    $('<div />').css({
        border: '1px solid gold',width: (200 - (5 * i)),float: 'right',clear: 'right'
    }).prependTo($('#right'))
}

原文地址：https://www.jb51.cc/html/229366.html