如何做一个平行四边形与变换 [英] How to make a parallelogram with transform

问题描述

我想创建此元素：

更新

解决方案：

  ：基质（2.304,1.020,0.000,2.098,138.441，-46.000）; 
  

解决方案

会给你你想要的东西：

  -moz-transform：rotate（90deg）; 
  

看看这个：

https://developer.mozilla.org/en/CSS/Using_CSS_transforms

I want to make this element:

http://screencast.com/t/T95m22e8OQy

And I know -moz-transform: skew();

#parallelogram {
width: 150px;
height: 100px;
-webkit-transform: skew(20deg);
-moz-transform: skew(20deg);
-o-transform: skew(20deg);
-ms-transform: skew(20deg);
background: #FF0000;}

for this:

http://screencast.com/t/HSQ4CLCc

Update

THE SOLUTION:

 transform:         matrix(2.304, 1.020, 0.000, 2.098, 138.441, -46.000);

解决方案

You can do a rotation added to the skew, it will give you something like you want :

-moz-transform: rotate(90deg);

look at this :

https://developer.mozilla.org/en/CSS/Using_CSS_transforms

这篇关于如何做一个平行四边形与变换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！