0

img を含む画像または div のマスク (アルファ) として、45 度回転した div を使用することは可能ですか?

http://i.stack.imgur.com/X2G9f.jpg

4

3 に答える 3

2

内側の要素を -45 度回転させてみませんか?

div.mask {
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg); 
}

div.mask img {
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg); 
}

subhaze が提供するJSFiddle の例-こちら

于 2012-11-29T04:33:04.693 に答える
1

Jquery プラグインを使用できる場合、これは必要なことを実行しますjqueryrotate
これは非常に使いやすく、CSS を暗示する必要はなく、クロスブラウザーでもあります。

于 2012-11-29T04:36:36.740 に答える
0

CSStransformプロパティを使用できます。

これを参照してください: http://davidwalsh.name/css-transform-rotate

于 2012-11-29T04:30:33.037 に答える