html - 透视文本不适合 CSS

Question

我已尽一切努力使用 CSS 透视图使此文本适合框。但它实际上不适合任何形式。

我当前的代码:

<img src="./img/parcel.png" width="350px">
<div class="centerparcel">
Text on Box Here
</div>

.centerparcel:

position: absolute;
top: 65%;
left: 37.5%;
width: 285px;
font-size: 25px;
vertical-align: top;
transform: translate(-50%, -50%) rotateY(-30deg) rotateX(0deg);

但它看起来很局促和压扁..

是否有额外的旋转功能可以使这更容易，还是我必须继续尝试直到我做对为止？

Answer 1

感谢 CBroe 通过评论“添加一些倾斜以获得正确的效果”来帮助我解决这个问题。

直到现在我才知道倾斜是一种风格。

我解决的代码:

transform: translate(-50%, -50%) skewY(8deg);