首页 > 技术文章 > 平行四边形 css实现

RonnieQin 2017-12-11 17:58 原文

首先将 display 设置为  inline-block 或block;

在应用skew(); transform:skewX(-45deg);

但是也会导致平行四边形内的文字倾斜如下

我们可以给文字加上一个容易 并设置相反的skew(),从而使内容的倾斜角度达到抵消的效果;

还有伪元素素的方法 没有试验成功。

https://www.w3cplus.com/css3/css-secrets/parallelograms.html

推荐阅读