将CSS偏斜变换应用于元素时,反向偏斜值是多少?

时间:2012-05-04 09:53:58

标签: css3 transform rotation reverse skew

我正在使用CSS变换来扭曲和旋转元素,我想通过应用“反向”变换使内部元素再次显示正常。通过旋转很容易:如果你有一个旋转45度的元素,那么内部旋转-45度会再次看起来“正常”。

现在,旋转和倾斜并不容易。请在此处查看此示例:http://jsfiddle.net/8R4ym/56/

文本以至少正确定位的方式旋转和倾斜但是我似乎无法找到使用某种反向变换使其看起来完全正常的“规则”。有任何想法吗?非常感谢!

1 个答案:

答案 0 :(得分:1)

我相信这是您正在寻找的效果:http://jsfiddle.net/8R4ym/108/

我相信non-communicative操作会弄乱你的形象。重要的是歪斜和旋转的顺序。 “transform”似乎从左到右执行它们(首先旋转然后倾斜),并且不允许在单个定义空间中使用“transform”属性两次。我找不到任何方法来改变执行操作的顺序,所以我改为插入另一个div,以便在第二次旋转之前执行偏斜。我希望这就是你要找的东西。

编辑:我刚发现文字大小差异很小。我想你可能不得不放弃一些文本大小来增加文本大小。