Html 沿倾斜div边缘对齐的非倾斜文本
我试图在倾斜div中生成普通文本。我希望沿倾斜div的边缘保持对齐,如下所示: 这段代码可以在这里看到: 它不漂亮;每个图元都包裹在浮动跨距中Html 沿倾斜div边缘对齐的非倾斜文本,html,css,frontend,skew,Html,Css,Frontend,Skew,我试图在倾斜div中生成普通文本。我希望沿倾斜div的边缘保持对齐,如下所示: 这段代码可以在这里看到: 它不漂亮;每个图元都包裹在浮动跨距中 <div class="section_header twist_right"> <span class="float twist_left">The </span> <span class="float twist_left">Quick </span&
<div class="section_header twist_right">
<span class="float twist_left">The </span>
<span class="float twist_left">Quick </span>
<span class="float twist_left">Brown </span>
<span class="float twist_left">Fox </span>
<span class="float twist_left">Jumped </span>
<span class="float twist_left">Over </span>
<span class="float twist_left">The </span>
<span class="float twist_left">Lazy </span>
<span class="float twist_left">Dog </span>
</div>
这个
快的
棕色的
福克斯
跳
结束
这个
懒惰的
狗
有没有办法在一个文本包装器中实现此功能?例如:
<div class="section_header twist_right">
<p class="twist_left"> The quick brown fox jumped over the lazy dog</p>
</div>
那只敏捷的棕色狐狸跳过了那只懒狗
我一直无法让上面的工作,因为它仍然沿着垂直边缘对齐文本。好奇是否有其他人遇到过这个问题或知道解决方案。谢谢。我自己也在为这样一个问题寻找一个好的答案,这个问题不是一个性能限制、骇人听闻、支持度高的问题 我能找到的最接近的是Adobe在CSS3形状方面的努力