html - 如何创建倾斜的多行段落(HTML CSS)？

Question

我需要创建一个多行斜线段落，因为每一行都逐渐缩进，这样段落的左边缘将创建一条斜线(而不是完全垂直的)。

一个非常笨拙的尝试是这样的(但我想知道是否有更优雅的解决方案):

<p style="font-style: oblique;">
&nbsp;&nbsp;&nbsp;This is an oblique paragraph.<br />
&nbsp;&nbsp;This paragraph continues.<br />
&nbsp;This paragraph continues.<br />
This paragraph continues...</p>

结果是:

这是一段，倾斜。
此段继续。
此段继续。
此段继续...

谢谢! ...甚至更好:谢谢! :)

Answer 1

如何使用 skew()

p {
  transform: skewX(-20deg);
  padding: 40px;
}

<p>
  Some text <br>
  Some text <br>
  Some text <br>
  Some text <br>
</p>

这里没什么好解释的，我只是使用skew 将p 文本倾斜-20deg，你可以做到20deg 如果您想将文本向相反的方向倾斜。