Css左右两个框用变换

Question

正如我的标题是我有两个像这样的人，现在你可以理解我的问题;）  在响应式布局中，我希望显示带有背景黄色变换的这个框，这样左边的一个是向左浮动而另一个是浮动在浏览器窗口右侧。我认为太难了请帮助我的朋友:(

iam使用css3

Answer 1

这是您的（主要）跨浏览器解决方案：

<style type="text/css">
#oneOfYourRectangles
{
    -ms-transform:rotate(10deg); /* IE 9 */
    -moz-transform:rotate(10deg); /* Firefox */
    -webkit-transform:rotate(10deg); /* Safari and Chrome */
    -o-transform:rotate(10deg); /* Opera */
}
#theOtherRectangle
{
    -ms-transform:rotate(350deg); /* IE 9 */
    -moz-transform:rotate(350deg); /* Firefox */
    -webkit-transform:rotate(350deg); /* Safari and Chrome */
    -o-transform:rotate(350deg); /* Opera */
}
</style>

嗯，我知道，我从未尝试过测试是否支持负值。

另外，请注意，显然10deg和350deg只是猜测。用最适合的值替换它们。

而且，只是为了测试，请注意webkit（Safari和Chrome）也支持3D转换。